From a14ef84dbdc54b9c2f8698c3d8b010c797995f01 Mon Sep 17 00:00:00 2001
From: jinhojang6 <jinho5051@gmail.com>
Date: Sun, 14 May 2023 21:53:15 +0900
Subject: [PATCH] temporary CSS updates

---
 src/components/FeaturedPost/FeaturedPost.tsx    | 8 ++++++--
 src/components/Navbar/Navbar.tsx                | 4 ++--
 src/components/Searchbar/SearchbarContainer.tsx | 3 ++-
 3 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/components/FeaturedPost/FeaturedPost.tsx b/src/components/FeaturedPost/FeaturedPost.tsx
index 47fa5f6..d5036e8 100644
--- a/src/components/FeaturedPost/FeaturedPost.tsx
+++ b/src/components/FeaturedPost/FeaturedPost.tsx
@@ -9,7 +9,7 @@ type Props = {
 
 const FeaturedPost = ({ post }: Props) => {
   return (
-    <Grid>
+    <CustomGrid>
       <GridItem className="w-16">
         <PostLink href={`/article/${post.slug}`}>
           <PostWrapper>
@@ -20,10 +20,14 @@ const FeaturedPost = ({ post }: Props) => {
           </PostWrapper>
         </PostLink>
       </GridItem>
-    </Grid>
+    </CustomGrid>
   )
 }
 
+const CustomGrid = styled(Grid)`
+  margin-bottom: 108px;
+`
+
 const PostWrapper = styled.div`
   margin-top: 16px;
   padding: 16px 0;
diff --git a/src/components/Navbar/Navbar.tsx b/src/components/Navbar/Navbar.tsx
index f0221a7..7e02713 100644
--- a/src/components/Navbar/Navbar.tsx
+++ b/src/components/Navbar/Navbar.tsx
@@ -38,8 +38,8 @@ const Container = styled.nav`
   border-bottom: 1px solid rgb(var(--lsd-theme-primary));
   position: fixed;
   top: 0;
-  width: calc(100% + 16px);
-  max-width: ${uiConfigs.maxContainerWidth + 16}px;
+  width: 100%;
+  max-width: ${uiConfigs.maxContainerWidth + 24}px; // TBD
   background: rgb(var(--lsd-surface-primary));
   z-index: 100;
 
diff --git a/src/components/Searchbar/SearchbarContainer.tsx b/src/components/Searchbar/SearchbarContainer.tsx
index 1fd9a85..abb0e5c 100644
--- a/src/components/Searchbar/SearchbarContainer.tsx
+++ b/src/components/Searchbar/SearchbarContainer.tsx
@@ -40,7 +40,7 @@ export function SearchbarContainer({ children, onUnfocus = nope }: Props) {
 
 const SearchBarWrapper = styled.div<Props>`
   display: block;
-  width: calc(100% - 16px);
+  width: 100%;
   background: rgb(var(--lsd-surface-primary));
   border-bottom: 1px solid rgb(var(--lsd-border-primary));
   border-top: 1px solid rgb(var(--lsd-border-primary));
@@ -53,5 +53,6 @@ const SearchBarWrapper = styled.div<Props>`
     position: fixed;
     top: ${uiConfigs.navbarRenderedHeight - 1}px;
     z-index: 100;
+    max-width: ${uiConfigs.maxContainerWidth + 40}px; // TBD
   }
 `