From c5b5b75db3f7e7a6b485fd91ec9de69068f163dc Mon Sep 17 00:00:00 2001
From: guesung <gueit214@naver.com>
Date: Tue, 13 Aug 2024 14:40:22 +0900
Subject: [PATCH] =?UTF-8?q?refactor:=20`.bottom-fixed`=20=EC=9C=A0?=
 =?UTF-8?q?=ED=8B=B8=20=EC=8A=A4=ED=83=80=EC=9D=BC=EC=9D=84=20=EC=A0=9C?=
 =?UTF-8?q?=EA=B1=B0=ED=95=9C=EB=8B=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/(Main)/talk/TalkSection.tsx  | 6 +++---
 src/app/(Main)/talk/TitleSection.tsx | 2 +-
 src/app/(Main)/talk/page.tsx         | 5 +++--
 src/app/globals.css                  | 6 ------
 4 files changed, 7 insertions(+), 12 deletions(-)

diff --git a/src/app/(Main)/talk/TalkSection.tsx b/src/app/(Main)/talk/TalkSection.tsx
index f3903d9..d74d2a8 100644
--- a/src/app/(Main)/talk/TalkSection.tsx
+++ b/src/app/(Main)/talk/TalkSection.tsx
@@ -32,11 +32,11 @@ export default function TalkWordSection() {
 
   return (
     <section className="flex flex-col items-center">
-      <h1 className="h-100 max-w-310 items-center break-keep text-center">{talkWord}</h1>
+      <h1 className="items-center text-center h-100 max-w-310 break-keep">{talkWord}</h1>
 
       <Spacing size={10} />
 
-      <div className="flex h-300 justify-center">
+      <div className="flex justify-center h-300">
         {!isWordLoaded && isLoading && <Lottie loop animationData={lottieTalkBeforeClick} play />}
         {isWordLoaded && isLoading && (
           <Lottie loop animationData={lottieTalkAfterClick} play speed={1.2} className="w-500" />
@@ -47,7 +47,7 @@ export default function TalkWordSection() {
       </div>
 
       <BottomFixedDiv>
-        <PrimaryButton onClick={handleTalkClick} text="제시어 뽑기" />
+        <PrimaryButton className="w-full" onClick={handleTalkClick} text="제시어 뽑기" />
       </BottomFixedDiv>
     </section>
   );
diff --git a/src/app/(Main)/talk/TitleSection.tsx b/src/app/(Main)/talk/TitleSection.tsx
index 53eacc3..627e07c 100644
--- a/src/app/(Main)/talk/TitleSection.tsx
+++ b/src/app/(Main)/talk/TitleSection.tsx
@@ -4,7 +4,7 @@ import { useState } from 'react';
 import TalkToolTip from './TalkToolTip';
 import { Icon } from '@/components/Button/Icon';
 import { Spacing } from '@/components/Spacing';
-import { ICON, COOKIE_IS_TOOLTIP_OPEN } from '@/constants';
+import { COOKIE_IS_TOOLTIP_OPEN, ICON } from '@/constants';
 import { setClientCookie } from '@/utils';
 
 interface TitleSectionProps {
diff --git a/src/app/(Main)/talk/page.tsx b/src/app/(Main)/talk/page.tsx
index fe29437..e9b3fce 100644
--- a/src/app/(Main)/talk/page.tsx
+++ b/src/app/(Main)/talk/page.tsx
@@ -1,12 +1,13 @@
 import TalkWordSection from './TalkSection';
 import TalkTitleSection from './TitleSection';
+import { COOKIE_IS_TOOLTIP_OPEN } from '@/constants';
 import { getServerCookie } from '@/utils';
 
 export default async function Talk() {
-  const isToolTipOpen = (await getServerCookie('tooltipIsOpen')) === 'true';
+  const isToolTipOpen = (await getServerCookie(COOKIE_IS_TOOLTIP_OPEN)) === 'true';
 
   return (
-    <div className="flex flex-col items-center justify-center flex-1">
+    <div className="flex flex-1 flex-col items-center justify-center">
       <TalkTitleSection isInitialToolTipOpen={isToolTipOpen} />
       <TalkWordSection />
     </div>
diff --git a/src/app/globals.css b/src/app/globals.css
index 6089cc0..2524c82 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -28,12 +28,6 @@ body {
   }
 }
 
-@layer base {
-  .bottom-fixed {
-    @apply fixed inset-x-0 bottom-0 z-30;
-  }
-}
-
 /*PWA*/
 @media all and (display-mode: standalone) {
   #ios-banner {