✨ feat: RecipeCard

:%s

src/components/common/FeaturedProductCard/FeaturedProductCard.module.scss

@@ -3,7 +3,7 @@
     width: 59.8rem;
     height: 28.8rem;
     padding: 2.4rem;
-    @apply bg-primary-light flex justify-start items-center custom-border-radius ;
+    @apply bg-primary-light inline-flex justify-start items-center custom-border-radius ;
     .left{
         width: 24rem;
         height: 24rem;

src/components/common/RecipeCard/RecipeCard.module.scss

@@ -1,19 +1,24 @@
 .recipeCardWarpper{
     width: 39.2rem;
     height: 34rem;
+    @apply inline-flex flex-col justify-between;
     .image{
         width: 100%;
         height: 22rem;
         border-radius: 2.4rem;
     }
     .title{
+        padding: 1.6rem 8rem 0.4rem 0.8rem;
+        // padding: 0 0.8rem;
+        @apply font-bold;
         font-size: 2rem;
         line-height: 2.8rem;
         letter-spacing: -0.01em;
         color: var(--text-active);
     }
     .description{
-        @apply overflow-hidden over overflow-ellipsis 
+        padding: 0 0.8rem;
+        @apply overflow-hidden overflow-ellipsis ;
         display: -webkit-box;
         -webkit-line-clamp: 3; /* number of lines to show */
         -webkit-box-orient: vertical;

src/components/common/index.ts

@@ -6,6 +6,7 @@ export { default as LabelCommon } from './LabelCommon/LabelCommon'
 export { default as ProductCard } from './ProductCard/ProductCard'
 export { default as ProductCaroucel } from './ProductCaroucel/ProductCaroucel'
 export { default as FeaturedProductCard } from './FeaturedProductCard/FeaturedProductCard'
+export { default as RecipeCard } from './RecipeCard/RecipeCard'
 export { default as Head } from './Head/Head'
 export { default as ViewAllItem} from './ViewAllItem/ViewAllItem'
 export { default as ItemWishList} from './ItemWishList/ItemWishList'