From 804dfccf40f8f4d4fa677c90413bd161d6699ef4 Mon Sep 17 00:00:00 2001
From: grapefruit <liam.heo11@gmail.com>
Date: Sun, 12 Jan 2025 22:37:52 +0900
Subject: [PATCH 01/10] =?UTF-8?q?fix:=20arrowNext=20=EC=95=84=EC=9D=B4?=
 =?UTF-8?q?=EC=BD=98=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/Icon/assets/ArrowNext.tsx | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/components/common/Icon/assets/ArrowNext.tsx b/src/components/common/Icon/assets/ArrowNext.tsx
index 89b076b2..fa3601f9 100644
--- a/src/components/common/Icon/assets/ArrowNext.tsx
+++ b/src/components/common/Icon/assets/ArrowNext.tsx
@@ -11,15 +11,16 @@ const ArrowNext = ({
       width={width}
       height={height}
       viewBox='0 0 24 24'
+      fill='none'
       xmlns='http://www.w3.org/2000/svg'
       {...props}
     >
       <path
-        fillRule='evenodd'
-        clipRule='evenodd'
-        d='M9.86321 6.2636C10.2147 5.91213 10.7845 5.91213 11.136 6.2636L16.236 11.3636C16.5875 11.7151 16.5875 12.2849 16.236 12.6364L11.136 17.7364C10.7845 18.0879 10.2147 18.0879 9.86321 17.7364C9.51174 17.3849 9.51174 16.8151 9.86321 16.4636L14.3268 12L9.86321 7.5364C9.51174 7.18492 9.51174 6.61508 9.86321 6.2636Z'
-        stroke='none'
-        fill={color}
+        d='M8.25 4.5L15.75 12L8.25 19.5'
+        stroke={color}
+        strokeWidth='1.5'
+        strokeLinecap='round'
+        strokeLinejoin='round'
       />
     </svg>
   );

From 1ed1e5f182ca9b0379c9a96367073477b75bc374 Mon Sep 17 00:00:00 2001
From: grapefruit <liam.heo11@gmail.com>
Date: Sun, 12 Jan 2025 22:38:08 +0900
Subject: [PATCH 02/10] =?UTF-8?q?fix:=20arrowNext=20stroke=EB=A1=9C=20?=
 =?UTF-8?q?=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/Icon/assets/index.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/common/Icon/assets/index.ts b/src/components/common/Icon/assets/index.ts
index 8b7c4ce6..94874348 100644
--- a/src/components/common/Icon/assets/index.ts
+++ b/src/components/common/Icon/assets/index.ts
@@ -47,7 +47,7 @@ export const iconMap: Record<string, IconMapEntry> = {
   arrowUp: { type: 'stroke', file: Arrowup },
   arrowDown: { type: 'stroke', file: ArrowDown },
   arrowPrev: { type: 'fill', file: ArrowPrev },
-  arrowNext: { type: 'fill', file: ArrowNext },
+  arrowNext: { type: 'stroke', file: ArrowNext },
   arrowPrevBlock: { type: 'fill', file: ArrowPrevBlock },
   arrowNextBlock: { type: 'fill', file: ArrowNextBlock },
   dashboard: {

From f9ed5597847542aa169e9624d91d39b3f503ce03 Mon Sep 17 00:00:00 2001
From: grapefruit <liam.heo11@gmail.com>
Date: Mon, 13 Jan 2025 11:29:25 +0900
Subject: [PATCH 03/10] =?UTF-8?q?fix:=20typography=20=EC=BB=A8=ED=94=8C?=
 =?UTF-8?q?=EB=A6=AD=ED=8A=B8=20=ED=95=B4=EA=B2=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/Typography/index.tsx | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/components/common/Typography/index.tsx b/src/components/common/Typography/index.tsx
index 9d32b5d2..20f36154 100644
--- a/src/components/common/Typography/index.tsx
+++ b/src/components/common/Typography/index.tsx
@@ -43,6 +43,11 @@ export const InfoCardTypo = customTypography('span', {
   color: 'black',
 });
 
+export const Subtitle2Black = customTypography('span', {
+  type: 'Subtitle2',
+  color: 'black',
+});
+
 export const Label1White = customTypography('span', {
   type: 'label1',
   color: 'white',

From 186144f6ffad203274a3f19bd03a54ecbd90379d Mon Sep 17 00:00:00 2001
From: grapefruit <liam.heo11@gmail.com>
Date: Sun, 12 Jan 2025 22:38:42 +0900
Subject: [PATCH 04/10] =?UTF-8?q?feat:=20NavProfile=20=EB=A6=AC=EB=94=94?=
 =?UTF-8?q?=EC=9E=90=EC=9D=B8=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/NavProfile/index.tsx | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/src/components/common/NavProfile/index.tsx b/src/components/common/NavProfile/index.tsx
index d32b50d8..0a389ce5 100644
--- a/src/components/common/NavProfile/index.tsx
+++ b/src/components/common/NavProfile/index.tsx
@@ -1,17 +1,20 @@
 import Badge from '@/components/common/Badge';
 import Icon from '@/components/common/Icon';
+import { Subtitle2Black, TableBodyTypo } from '@/components/common/Typography';
 
 const NavProfile = ({ name = '냠냠' }: { name: string }) => {
   return (
-    <button className='flex h-[90px] w-full items-center justify-between px-10 py-6'>
-      <Badge imageSrc='/imgs/pi-gon-ping.jpg' />
-      <div className='flex flex-col gap-[2px]'>
-        <span className='text-nowrap text-xs text-gray-600'>
-          다시 만나 기뻐요🐭
-        </span>
-        <span className='text-sm text-dark-100'>{name}님</span>
+    <button className='flex w-full items-center justify-between gap-2'>
+      <Badge
+        imageSrc='/imgs/pi-gon-ping.jpg'
+        size={40}
+        className='border border-grey-100'
+      />
+      <div className='flex items-center justify-center gap-2'>
+        <TableBodyTypo>다시 만나 기뻐요!</TableBodyTypo>
+        <Subtitle2Black>{name}님</Subtitle2Black>
       </div>
-      <Icon name='arrowNext' color='black' className='hover:stroke-dark-200' />
+      <Icon name='arrowNext' color='black' />
     </button>
   );
 };

From 9aebc4962f389ab5a5c3d87ef8d7a8dbb311c06c Mon Sep 17 00:00:00 2001
From: grapefruit <liam.heo11@gmail.com>
Date: Sun, 12 Jan 2025 22:46:26 +0900
Subject: [PATCH 05/10] =?UTF-8?q?style:=20NavProvile=20w-238px=20=EC=A0=81?=
 =?UTF-8?q?=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/NavProfile/index.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/common/NavProfile/index.tsx b/src/components/common/NavProfile/index.tsx
index 0a389ce5..1b6dc577 100644
--- a/src/components/common/NavProfile/index.tsx
+++ b/src/components/common/NavProfile/index.tsx
@@ -4,8 +4,9 @@ import { Subtitle2Black, TableBodyTypo } from '@/components/common/Typography';
 
 const NavProfile = ({ name = '냠냠' }: { name: string }) => {
   return (
-    <button className='flex w-full items-center justify-between gap-2'>
+    <button className='flex w-[238px] items-center justify-between gap-2'>
       <Badge
+        // TODO: 추후 이미지 변경 필요
         imageSrc='/imgs/pi-gon-ping.jpg'
         size={40}
         className='border border-grey-100'

From 03ab2cc95a74f3f8b5dc33b28dc498319a28ea95 Mon Sep 17 00:00:00 2001
From: grapefruit <liam.heo11@gmail.com>
Date: Sun, 12 Jan 2025 22:46:45 +0900
Subject: [PATCH 06/10] =?UTF-8?q?style:=20header-logo=20png=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/imgs/header-logo.png | Bin 0 -> 3563 bytes
 1 file changed, 0 insertions(+), 0 deletions(-)
 create mode 100644 public/imgs/header-logo.png

diff --git a/public/imgs/header-logo.png b/public/imgs/header-logo.png
new file mode 100644
index 0000000000000000000000000000000000000000..349e505e1b1f98bb89390ce596b76208c36a6fc7
GIT binary patch
literal 3563
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

literal 0
HcmV?d00001


From eb71a6abcfeb89daf3ff8b0bcafc8ddee8d08cef Mon Sep 17 00:00:00 2001
From: grapefruit <liam.heo11@gmail.com>
Date: Sun, 12 Jan 2025 22:47:07 +0900
Subject: [PATCH 07/10] =?UTF-8?q?feat:=20Header=20=EC=BB=B4=ED=8F=AC?=
 =?UTF-8?q?=EB=84=8C=ED=8A=B8=20=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/Header/index.tsx | 29 ++++++++++++++++++++++++++
 1 file changed, 29 insertions(+)
 create mode 100644 src/components/common/Header/index.tsx

diff --git a/src/components/common/Header/index.tsx b/src/components/common/Header/index.tsx
new file mode 100644
index 00000000..228c0a25
--- /dev/null
+++ b/src/components/common/Header/index.tsx
@@ -0,0 +1,29 @@
+'use client';
+
+import Image from 'next/image';
+import { useEffect, useState } from 'react';
+import NavProfile from '@/components/common/NavProfile';
+import { useUserStore } from '@/stores/useUserStore';
+
+const Header = () => {
+  const [isMounted, setIsMounted] = useState(false);
+  const username = useUserStore((state) => state.username);
+
+  useEffect(() => {
+    setIsMounted(true);
+  }, []);
+
+  return (
+    <header className='fixed top-0 z-10 flex w-full flex-row items-center justify-between border border-b-gray-100 bg-white-100 px-6 py-4'>
+      <Image
+        src='/imgs/header-logo.png'
+        width={66}
+        height={48}
+        alt='header logo'
+      />
+      <NavProfile name={isMounted ? username : ''} />
+    </header>
+  );
+};
+
+export default Header;

From 582c98646d319fc55931f5d501c15d73715f936b Mon Sep 17 00:00:00 2001
From: grapefruit <liam.heo11@gmail.com>
Date: Sun, 12 Jan 2025 22:47:29 +0900
Subject: [PATCH 08/10] =?UTF-8?q?feat:=20RootLayout=EC=97=90=20Header=20?=
 =?UTF-8?q?=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/(root)/layout.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/app/(root)/layout.tsx b/src/app/(root)/layout.tsx
index 867b0cda..6f5865c3 100644
--- a/src/app/(root)/layout.tsx
+++ b/src/app/(root)/layout.tsx
@@ -1,8 +1,10 @@
+import Header from '@/components/common/Header';
 import Navbar from '@/components/common/Navbar';
 
 const RootLayout = ({ children }: { children: React.ReactNode }) => {
   return (
     <div className='flex min-h-screen'>
+      <Header />
       <Navbar />
       <main className='flex-grow bg-white-200 p-6 pt-12'>{children}</main>
     </div>

From ddc3791ccbc8907fa93da923aaddf105de953174 Mon Sep 17 00:00:00 2001
From: grapefruit <liam.heo11@gmail.com>
Date: Mon, 13 Jan 2025 11:23:33 +0900
Subject: [PATCH 09/10] =?UTF-8?q?feat:=20useMounted=20=ED=9B=85=20?=
 =?UTF-8?q?=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/hooks/useMounted.ts | 11 +++++++++++
 1 file changed, 11 insertions(+)
 create mode 100644 src/hooks/useMounted.ts

diff --git a/src/hooks/useMounted.ts b/src/hooks/useMounted.ts
new file mode 100644
index 00000000..9d0b34a3
--- /dev/null
+++ b/src/hooks/useMounted.ts
@@ -0,0 +1,11 @@
+import { useEffect, useState } from 'react';
+
+export const useMounted = () => {
+  const [isMounted, setIsMounted] = useState(false);
+
+  useEffect(() => {
+    setIsMounted(true);
+  }, []);
+
+  return isMounted;
+};

From 14c02fc3888c800785ccd66418feca389c3b6ec9 Mon Sep 17 00:00:00 2001
From: grapefruit <liam.heo11@gmail.com>
Date: Mon, 13 Jan 2025 11:23:51 +0900
Subject: [PATCH 10/10] =?UTF-8?q?feat:=20Header=20-=20useMounted=20?=
 =?UTF-8?q?=ED=9B=85=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/Header/index.tsx | 8 ++------
 1 file changed, 2 insertions(+), 6 deletions(-)

diff --git a/src/components/common/Header/index.tsx b/src/components/common/Header/index.tsx
index 228c0a25..008fb6c2 100644
--- a/src/components/common/Header/index.tsx
+++ b/src/components/common/Header/index.tsx
@@ -1,18 +1,14 @@
 'use client';
 
 import Image from 'next/image';
-import { useEffect, useState } from 'react';
 import NavProfile from '@/components/common/NavProfile';
+import { useMounted } from '@/hooks/useMounted';
 import { useUserStore } from '@/stores/useUserStore';
 
 const Header = () => {
-  const [isMounted, setIsMounted] = useState(false);
+  const isMounted = useMounted();
   const username = useUserStore((state) => state.username);
 
-  useEffect(() => {
-    setIsMounted(true);
-  }, []);
-
   return (
     <header className='fixed top-0 z-10 flex w-full flex-row items-center justify-between border border-b-gray-100 bg-white-100 px-6 py-4'>
       <Image