From 4ad8e038205cf1b61cc7eadf71575996d940a7cc Mon Sep 17 00:00:00 2001
From: jinhojang6 <jinho5051@gmail.com>
Date: Sun, 7 Jul 2024 22:36:51 +0900
Subject: [PATCH] style: implement design update request

---
 src/components/Article/Article.Block.tsx      |  4 +++
 src/components/Article/Article.Body.tsx       | 34 +++++++++++++++++++
 .../Article/Header/Article.Header.tsx         |  4 +++
 src/containers/HomePage/HomePage.tsx          |  4 +++
 4 files changed, 46 insertions(+)

diff --git a/src/components/Article/Article.Block.tsx b/src/components/Article/Article.Block.tsx
index 45d2fd6..835d17f 100644
--- a/src/components/Article/Article.Block.tsx
+++ b/src/components/Article/Article.Block.tsx
@@ -181,6 +181,10 @@ const Paragraph = styled(Typography)`
   &.u-text-align-center {
     text-align: center;
   }
+
+  & > strong {
+    margin-bottom: 16px;
+  }
 `
 
 const IframeContainer = styled.div<{ isSimplecast?: boolean }>`
diff --git a/src/components/Article/Article.Body.tsx b/src/components/Article/Article.Body.tsx
index e361d69..c47bfcf 100644
--- a/src/components/Article/Article.Body.tsx
+++ b/src/components/Article/Article.Body.tsx
@@ -31,4 +31,38 @@ const ArticleContainer = styled.article`
   gap: 16px;
   max-width: 700px;
   padding-bottom: 80px;
+
+  h2,
+  h3 {
+    margin-bottom: unset;
+  }
+
+  // p tag does not include strong tag as a child
+  h3 + span + p {
+    margin-top: 16px;
+  }
+
+  h3 + span + p:has(strong) {
+    margin-top: unset;
+  }
+
+  /* h3 + span + p:has(strong) + span + p {
+    margin-top: 16px;
+  } */
+
+  h2 + span + p {
+    margin-top: 16px;
+  }
+
+  h2 + span + p:has(strong) {
+    margin-top: unset;
+  }
+
+  /* h2 + span + p:has(strong) + span + p {
+    margin-top: 16px;
+  } */
+
+  h2 + span + h3 {
+    margin-top: unset;
+  }
 `
diff --git a/src/components/Article/Header/Article.Header.tsx b/src/components/Article/Header/Article.Header.tsx
index b3474f1..205096e 100644
--- a/src/components/Article/Header/Article.Header.tsx
+++ b/src/components/Article/Header/Article.Header.tsx
@@ -77,6 +77,10 @@ const ArticleHeader = ({
 const ArticleHeaderContainer = styled.header`
   margin-bottom: 24px;
 
+  h1 {
+    margin-bottom: 16px;
+  }
+
   .mobileSummary {
     display: none;
   }
diff --git a/src/containers/HomePage/HomePage.tsx b/src/containers/HomePage/HomePage.tsx
index e94c25f..d6c67be 100644
--- a/src/containers/HomePage/HomePage.tsx
+++ b/src/containers/HomePage/HomePage.tsx
@@ -348,6 +348,10 @@ const FeaturedFirst = styled.div`
     .post-card__subtitle {
       margin-top: var(--lsd-spacing-16) !important;
     }
+
+    .post-card-wrapper > div {
+      gap: 0 64px !important;
+    }
   }
 `