Remove 3 unnecessary DOM elements from card

web/components/contract-card.tsx

@@ -25,25 +25,24 @@ export function ContractCard(props: {
 
   return (
     <Link href={contractPath(contract)}>
-      <a className={clsx('col-span-1', className)}>
+      <a
-        <li className="bg-white hover:bg-gray-100 shadow-md rounded-lg divide-y divide-gray-200 list-none">
+        className={clsx(
-          <div className="card">
+          'col-span-1 bg-white hover:bg-gray-100 shadow-md rounded-lg list-none card card-body p-6',
-            <div className="card-body p-6">
+          className
-              <Row className="justify-between gap-4 mb-2">
+        )}
-                <p className="font-medium text-indigo-700">{question}</p>
+      >
-                <ResolutionOrChance
+        <Row className="justify-between gap-4 mb-2">
-                  className="items-center"
+          <p className="font-medium text-indigo-700">{question}</p>
-                  resolution={resolution}
+          <ResolutionOrChance
-                  probPercent={probPercent}
+            className="items-center"
-                />
+            resolution={resolution}
-              </Row>
+            probPercent={probPercent}
-              <AbbrContractDetails
+          />
-                contract={contract}
+        </Row>
-                showHotVolume={showHotVolume}
+        <AbbrContractDetails
-              />
+          contract={contract}
-            </div>
+          showHotVolume={showHotVolume}
-          </div>
+        />
-        </li>
       </a>
     </Link>
   )

web/pages/index.tsx

@@ -55,11 +55,11 @@ const HotMarkets = (props: { hotContracts: Contract[] }) => {
     <div className="w-full bg-indigo-50 border-2 border-indigo-100 p-6 rounded-lg shadow-md">
       <Title className="mt-0" text="🔥 Markets" />
       <Col className="gap-6">
-        <Col className="md:flex-row gap-6">
+        <Col className="md:flex-row items-start gap-6">
           <ContractCard className="flex-1" contract={c1} showHotVolume />
           <ContractCard className="flex-1" contract={c2} showHotVolume />
         </Col>
-        <Col className="md:flex-row gap-6">
+        <Col className="md:flex-row items-start gap-6">
           <ContractCard className="flex-1" contract={c3} showHotVolume />
           <ContractCard className="flex-1" contract={c4} showHotVolume />
         </Col>