From b413eaa57938603ff5b312a1b35bee5c1f5cbd51 Mon Sep 17 00:00:00 2001
From: jinhojang6 <jinho5051@gmail.com>
Date: Sat, 23 Mar 2024 20:25:38 +0900
Subject: [PATCH] style: update CallToActionSection styles

---
 .../CallToActionSection.scss                  | 20 ++++++++++++++
 .../CallToActionSection.tsx                   | 26 ++++++++++++-------
 .../mdx/SectionHeader/SectionHeader.scss      |  5 ++++
 .../src/client/css/custom.scss                |  4 ---
 4 files changed, 41 insertions(+), 14 deletions(-)

diff --git a/packages/logos-docusaurus-theme/src/client/components/mdx/CallToActionSection/CallToActionSection.scss b/packages/logos-docusaurus-theme/src/client/components/mdx/CallToActionSection/CallToActionSection.scss
index 567e762..85f2c72 100644
--- a/packages/logos-docusaurus-theme/src/client/components/mdx/CallToActionSection/CallToActionSection.scss
+++ b/packages/logos-docusaurus-theme/src/client/components/mdx/CallToActionSection/CallToActionSection.scss
@@ -16,6 +16,12 @@
     width: fit-content;
   }
 
+  .mdx-cta-section__header__desktop-button {
+    .mdx-cta-button {
+      margin-top: unset;
+    }
+  }
+
   .mdx-cta-section--align-center {
     display: flex;
     flex-direction: column;
@@ -247,7 +253,21 @@
   }
 }
 
+@include utils.responsive('lg', 'up') {
+  .mdx-cta-section__header__mobile-button {
+    display: none;
+  }
+}
+
 @include utils.responsive('lg', 'down') {
+  .mdx-cta-section__header__desktop-button {
+    display: none;
+  }
+
+  .mdx-cta-section__header__mobile-button {
+    margin-top: 24px;
+  }
+
   .mdx-cta-section__title {
     @include lsd.typography('h3', true);
   }
diff --git a/packages/logos-docusaurus-theme/src/client/components/mdx/CallToActionSection/CallToActionSection.tsx b/packages/logos-docusaurus-theme/src/client/components/mdx/CallToActionSection/CallToActionSection.tsx
index 9fb8f35..e17e3bb 100644
--- a/packages/logos-docusaurus-theme/src/client/components/mdx/CallToActionSection/CallToActionSection.tsx
+++ b/packages/logos-docusaurus-theme/src/client/components/mdx/CallToActionSection/CallToActionSection.tsx
@@ -154,6 +154,17 @@ export const CallToActionSection: React.FC<CallToActionSectionProps> = ({
       ? 'list'
       : 'simple'
 
+  const button = href && ctaPosition === 'top' && (
+    <CallToActionButton
+      target={target}
+      href={href}
+      className="mdx-cta-section__link"
+      variant={variant}
+    >
+      {label}
+    </CallToActionButton>
+  )
+
   return (
     <div
       className={clsx(
@@ -174,22 +185,17 @@ export const CallToActionSection: React.FC<CallToActionSectionProps> = ({
           <Typography component="h2" className={clsx('mdx-cta-section__title')}>
             {title}
           </Typography>
-          {href && ctaPosition === 'top' && (
-            <CallToActionButton
-              target={target}
-              href={href}
-              className="mdx-cta-section__link"
-              variant={variant}
-            >
-              {label}
-            </CallToActionButton>
-          )}
+          <div className="mdx-cta-section__header__desktop-button">
+            {button}
+          </div>
         </div>
         {description && (
           <Typography component="h3" className="mdx-cta-section__description">
             {description}
           </Typography>
         )}
+        <div className="mdx-cta-section__header__mobile-button">{button}</div>
+
         {href && ctaPosition === 'bottom' && (
           <CallToActionButton
             target={target}
diff --git a/packages/logos-docusaurus-theme/src/client/components/mdx/SectionHeader/SectionHeader.scss b/packages/logos-docusaurus-theme/src/client/components/mdx/SectionHeader/SectionHeader.scss
index 937d2dc..bbe575c 100644
--- a/packages/logos-docusaurus-theme/src/client/components/mdx/SectionHeader/SectionHeader.scss
+++ b/packages/logos-docusaurus-theme/src/client/components/mdx/SectionHeader/SectionHeader.scss
@@ -47,4 +47,9 @@
       @include lsd.typography('h3');
     }
   }
+
+  .mdx-section-header__title {
+    display: flex;
+    flex-wrap: wrap;
+  }
 }
diff --git a/packages/logos-docusaurus-theme/src/client/css/custom.scss b/packages/logos-docusaurus-theme/src/client/css/custom.scss
index 0c89538..f58843c 100644
--- a/packages/logos-docusaurus-theme/src/client/css/custom.scss
+++ b/packages/logos-docusaurus-theme/src/client/css/custom.scss
@@ -345,10 +345,6 @@ a code {
     overflow-x: hidden !important;
   }
 
-  .navbar {
-    background-color: transparent;
-  }
-
   h2 {
     margin-top: unset !important;
   }