fix: update background content layout (#48)

* fix: update background content layout * fix: change padding
Nexters · Nov 9, 2024 · cb76bd0 · cb76bd0
1 parent 5da8f85
commit cb76bd0
Showing 1 changed file with 12 additions and 6 deletions.
diff --git a/src/app/(web)/layout.tsx b/src/app/(web)/layout.tsx
@@ -25,29 +25,35 @@ export default function Layout({ children }: { children: React.ReactNode }) {
         </div>
         <div
           className={cn(
-            'h-screen w-full max-w-[670px] overflow-scroll scrollbar-hide bg-opacity-65 bg-[url("/assets/background.png")]'
+            'h-screen w-full max-w-[670px] overflow-scroll bg-opacity-65 bg-[url("/assets/background.png")] scrollbar-hide'
           )}
         >
           {children}
         </div>
         <div
           className={cn(
-            'hidden h-[320px] w-[270px] flex-col items-center justify-center gap-[34px] lg:flex'
+            'hidden h-[320px] w-[calc((100vw-670px)/2)] max-w-[270px] flex-col items-center justify-center gap-[34px] px-2.5 lg:flex'
           )}
         >
-          <Image src={text} alt="text" width={194} draggable={false} />
-          <div className={cn('flex w-[200px] justify-between')}>
+          <Image className={cn('px-2.5')} src={text} alt="text" width={214} draggable={false} />
+          <div
+            className={cn(
+              'flex w-[calc((100vw-670px)/2)] max-w-[240px] justify-between gap-2.5 px-5'
+            )}
+          >
             <Link
+              className={cn('flex-1')}
               href="https://apps.apple.com/kr/app/weski-%EC%8A%A4%ED%82%A4%EC%9E%A5-%ED%81%90%EB%A0%88%EC%9D%B4%EC%85%98-%ED%94%8C%EB%9E%AB%ED%8F%BC/id6642660900"
               target="_blank"
             >
-              <Image src={ios} alt="ios" width={95} draggable={false} />
+              <Image src={ios} alt="ios" draggable={false} />
             </Link>
             <Link
+              className={cn('flex-1')}
               href="https://play.google.com/store/apps/details?id=com.dieski.weski"
               target="_blank"
             >
-            <Image src={android} alt="android" width={95} draggable={false} />
+              <Image src={android} alt="android" draggable={false} />
             </Link>
           </div>
         </div>