fix: block last tutorial is optional in home page (#63)

eleven-labs · Jan 29, 2024 · 8e07f05 · 8e07f05
1 parent 3b0b367
commit 8e07f05
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 4 deletions.
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@eleven-labs/design-system",
   "description": "Design System for Eleven Labs",
-  "version": "0.26.0",
+  "version": "0.26.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/eleven-labs/design-system.git"

diff --git a/src/components/Molecules/Cards/NewsletterCard/NewsletterCard.scss b/src/components/Molecules/Cards/NewsletterCard/NewsletterCard.scss
@@ -11,6 +11,8 @@
   }
 
   #{$this}__intro {
+    flex: 1;
+
     @if $variant == 'vertical' {
       padding-bottom: $spacing;
       border-bottom: $border;
@@ -44,4 +46,8 @@
       @include newsletter-variant($this, 'horizontal');
     }
   }
+
+  &__form {
+    flex: 2;
+  }
 }
diff --git a/src/components/Molecules/Cards/NewsletterCard/NewsletterCard.tsx b/src/components/Molecules/Cards/NewsletterCard/NewsletterCard.tsx
@@ -39,6 +39,6 @@ export const NewsletterCard: React.FC<NewsletterCardProps> = ({
       <Icon name="underline" color="accent" width="56px" />
       <Text mt="m">{description}</Text>
     </Box>
-    <Box>{children}</Box>
+    <Box className="newsletter-card__form">{children}</Box>
   </Flex>
 );
diff --git a/src/pages/HomePage/HomePage.tsx b/src/pages/HomePage/HomePage.tsx
@@ -12,7 +12,7 @@ import { LastTutorialsBlock } from '@/components/Organisms/Blocks/LastTutorialsB
 export type HomePageProps = {
   homeIntroBlock: HomeIntroBlockProps;
   lastArticlesBlock: LastArticlesBlockProps;
-  lastTutorialsBlock: LastTutorialsBlockProps;
+  lastTutorialsBlock?: LastTutorialsBlockProps;
   newsletterCard: NewsletterCardProps;
 };
 
@@ -25,7 +25,7 @@ export const HomePage: React.FC<HomePageProps> = ({
   <>
     <HomeIntroBlock {...homeIntroBlock} />
     <LastArticlesBlock {...lastArticlesBlock} />
-    <LastTutorialsBlock {...lastTutorialsBlock} />
+    {lastTutorialsBlock && <LastTutorialsBlock {...lastTutorialsBlock} />}
     <Box my="xl" mx={{ xs: 's', md: 'auto' }} width={{ md: 'content-container' }}>
       <NewsletterCard variant="horizontal" {...newsletterCard} />
     </Box>