feat: FeaturedCardBlog

src/components/modules/blogs/FeaturedCardBlog/FeaturedCardBlog.module.scss

@@ -0,0 +1,27 @@
+@import "../../../../styles/utilities";
+
+.featuredCard{
+    @apply flex flex-row justify-between;
+    padding-left: 11.2rem;
+    padding-right: 11.2rem;
+}
+.left{
+    max-width: 59.8rem;
+    min-height: 33.6rem;
+}
+.right{
+    max-width: 55.4rem;
+    min-height: 16.8rem;
+}
+.titleWrapper{
+    @apply flex flex-col items-start font-heading;
+    font-size: 3.2rem;
+    line-height: 4rem;
+    margin-bottom: 1.6rem;
+    .title{
+        margin-top: 0.4rem;
+    }
+}
+.content{
+    margin-top: 1.6rem
+}

src/components/modules/blogs/FeaturedCardBlog/FeaturedCardBlog.tsx

@@ -0,0 +1,35 @@
+
+import s from './FeaturedCardBlog.module.scss'
+import { Author, DateTime } from 'src/components/common'
+import Image from "next/image";
+
+interface FeaturedCardBlogProps{
+    title?: string,
+    content?: string,
+    imgSrc: any,
+    imgAuthor: any,
+    date: string,
+    authorName: string,
+}
+
+const FeaturedCardBlog = ({ title, content, imgSrc, imgAuthor, date, authorName }: FeaturedCardBlogProps) => {
+    return (
+        <section className={s.featuredCard}>
+
+            <div className={s.left}>
+                <Image src={imgSrc} alt="image feature card"/>
+            </div>
+            <div className={s.right}>
+                <div className={s.titleWrapper}>
+                    <DateTime date={date}/>
+                    <a className={s.title}>{title}</a>
+                </div>
+                <Author name={authorName} image={imgAuthor}/>
+                <div className={s.content}>{content}</div>
+            </div>
+
+        </section>
+    )
+}
+
+export default FeaturedCardBlog

src/components/modules/blogs/index.tsx

@@ -0,0 +1 @@
+export { default as FeaturedCardBlog } from './FeaturedCardBlog/FeaturedCardBlog'

src/components/modules/delivery-policy/DeliveryAndPolicyContent/DeliveryAndPolicyContent.tsx

@@ -0,0 +1,27 @@
+import { DateTime } from 'src/components/common'
+import s from './DeliveryAndPolicyContent.module.scss'
+
+interface DeliveryAndPolicyContentProps{
+    title?: string,
+    date: string,
+    content: string[],
+}
+
+const DeliveryAndPolicyContent = ( { title, date, content } : DeliveryAndPolicyContentProps) => {
+    return (
+        <section>
+
+            <div className={s.titleWrapper}>
+                <div>LASTEST UPDATED: 
+                    <DateTime date={date} />
+                </div>
+                <div className={s.title}>
+                    {title}
+                </div>
+            </div>
+
+        </section>
+    )
+}
+
+export default DeliveryAndPolicyContent

src/components/modules/delivery-policy/index.tsx

@@ -0,0 +1 @@
+export { default as DeliveryAndPolicyContent} from './DeliveryAndPolicyContent/DeliveryAndPolicyContent'