fix: whitespace in homepage cards

nl-design-system · Aug 23, 2024 · d896837 · d896837
1 parent f5e0448
commit d896837
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 29 deletions.
diff --git a/src/components/CardGroup.module.css b/src/components/CardGroup.module.css
@@ -51,10 +51,6 @@
   --card-illustration-margin-inline-start: 16px;
 }
 
-.cardgroup__card--medium {
-  --cardgroup-card-min-height: 286px;
-}
-
 .cardgroup__card--large {
   --cardgroup-card-flex-direction: row-reverse;
   --cardgroup-card-justify-content: space-between;
@@ -83,6 +79,7 @@
 
 .card__content {
   --utrecht-heading-2-margin-block-start: 0;
+  --utrecht-heading-3-margin-block-start: 0;
   display: flex;
   flex-direction: column;
   height: 100%;

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -50,13 +50,7 @@ export default function Home() {
         <div className="container" style={{ paddingBlockEnd: '40px' }}>
           <Heading2>Meedoen als...</Heading2>
           <CardGroup appearance="medium">
-            <Card component="section" appearance="small">
-              {/* <CardIllustration background>
-                <Image
-                  src="..."
-                  alt="..."
-                />
-              </CardIllustration> */}
+            <Card component="section" appearance="medium">
               <CardContent>
                 <div>
                   <Heading3>Manager</Heading3>
@@ -69,12 +63,6 @@ export default function Home() {
               </CardContent>
             </Card>
             <Card component="section" appearance="medium">
-              {/* <CardIllustration background>
-                <Image
-                  src="..."
-                  alt="..."
-                />
-              </CardIllustration> */}
               <CardContent>
                 <div>
                   <Heading3>Leverancier</Heading3>
@@ -87,12 +75,6 @@ export default function Home() {
               </CardContent>
             </Card>
             <Card component="section" appearance="medium">
-              {/* <CardIllustration background>
-                <Image
-                  src="..."
-                  alt="..."
-                />
-              </CardIllustration> */}
               <CardContent>
                 <div>
                   <Heading3>Developer</Heading3>
@@ -105,12 +87,6 @@ export default function Home() {
               </CardContent>
             </Card>
             <Card component="section" appearance="medium">
-              {/* <CardIllustration background>
-                <Image
-                  src="..."
-                  alt="..."
-                />
-              </CardIllustration> */}
               <CardContent>
                 <div>
                   <Heading3>Designer</Heading3>