CodeitFESI4-Team1 · yulrang · Nov 22, 2024 · Nov 20, 2024 · Nov 20, 2024 · Nov 20, 2024
diff --git a/src/styles/assets/icons/ic-sort-on.svg → public/assets/icons/ic-sort-on.svg b/src/styles/assets/icons/ic-sort-on.svg → public/assets/icons/ic-sort-on.svg
diff --git a/src/styles/assets/icons/ic-sort.svg → public/assets/icons/ic-sort.svg b/src/styles/assets/icons/ic-sort.svg → public/assets/icons/ic-sort.svg
diff --git a/public/assets/images/crew-sample/crew-sample-1.jpg b/public/assets/images/crew-sample/crew-sample-1.jpg
diff --git a/public/assets/images/crew-sample/crew-sample-2.jpg b/public/assets/images/crew-sample/crew-sample-2.jpg
diff --git a/public/assets/images/crew-sample/crew-sample-3.jpg b/public/assets/images/crew-sample/crew-sample-3.jpg
diff --git a/public/assets/images/gathering-sample/gathering-sample-1.jpg b/public/assets/images/gathering-sample/gathering-sample-1.jpg
diff --git a/public/assets/images/gathering-sample/gathering-sample-2.jpg b/public/assets/images/gathering-sample/gathering-sample-2.jpg
diff --git a/public/assets/images/gathering-sample/gathering-sample-3.jpg b/public/assets/images/gathering-sample/gathering-sample-3.jpg
diff --git a/public/assets/images/logo-icon.svg b/public/assets/images/logo-icon.svg
diff --git a/public/assets/images/logo.png b/public/assets/images/logo.png
diff --git a/public/assets/images/logo.svg b/public/assets/images/logo.svg
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/src/app/favicon.ico b/src/app/favicon.ico
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -28,6 +28,7 @@ export default function RootLayout({
           content="내 크루와 함께 약속하고 만나는 운동 소모임 웹사이트"
         />
         <meta property="og:url" content="https://crewcrew.vercel.app" />
+        <link rel="icon" href="/favicon.ico" />
         <ColorSchemeScript />
       </head>
       <body>

diff --git a/src/components/common/header/container.tsx b/src/components/common/header/container.tsx
@@ -18,7 +18,7 @@ export default function Header() {
   const { data: user } = useUser();
 
   return (
-    <div>
+    <div className="sticky top-0 z-10">
       <HeaderPresenter
         isAuth={isAuth}
         handleLogout={handleLogout}

diff --git a/src/components/common/header/presenter.tsx b/src/components/common/header/presenter.tsx
@@ -5,7 +5,8 @@ import Link from 'next/link';
 import { usePathname } from 'next/navigation';
 import { Menu } from '@mantine/core';
 import { Profile } from '@/src/components/common/profile';
-import Logo from '@/public/assets/images/logo.png';
+import IcoLogo from '@/public/assets/images/logo-icon.svg';
+import Logo from '@/public/assets/images/logo.svg';
 
 export interface HeaderPresenterProps {
   isAuth: boolean;
@@ -26,17 +27,17 @@ export default function HeaderPresenter({
 }: HeaderPresenterProps) {
   const pathname = usePathname();
   return (
-    <header className="sticky top-0 z-10 h-10 w-full bg-blue-500 px-6 md:h-13">
+    <header className="h-header w-full bg-blue-500 px-4 md:px-6">
       <div className="mx-auto flex h-full w-full max-w-[1200px] items-center justify-between">
-        <div className="flex space-x-2 md:space-x-5 lg:ml-2 lg:space-x-5">
-          <Link href="/" className="mt-1">
-            <Image src={Logo} alt="crew logo" width={83} height={30} className="hidden md:block" />
-            <Image src={Logo} alt="crew logo" width={53} height={28} className="block md:hidden" />
+        <div className="flex items-center gap-5 lg:ml-2">
+          <Link href="/" className="it ems-center flex gap-2">
+            <Image src={IcoLogo} alt="crew logo" aria-hidden width={32} height={32} className="" />
+            <Image src={Logo} alt="crew logo" width={83} height={24} className="hidden md:block" />
           </Link>
-          <nav className="flex items-center space-x-2 text-base font-semibold md:space-x-6 md:text-lg lg:space-x-6">
+          <nav className="flex items-center gap-3 text-base font-semibold md:gap-6 md:text-lg">
             <Link
               href="/"
-              className={`${pathname === '/' ? 'text-white' : 'text-blue-300'} ml-4 hidden md:block`}
+              className={`${pathname === '/' ? 'text-white' : 'text-blue-300'} hidden text-base font-semibold md:block md:text-lg`}
             >
               크루 찾기
             </Link>
@@ -46,7 +47,7 @@ export default function HeaderPresenter({
                 href={isAuth ? href : `/login?redirect=${href}`}
                 className={`${
                   pathname.startsWith(href) ? 'text-white' : 'text-blue-300'
-                } ml-4 text-sm font-semibold md:text-lg`}
+                } text-base font-semibold md:text-lg`}
               >
                 {label}
               </Link>
@@ -73,7 +74,7 @@ export default function HeaderPresenter({
             </Menu>
           </div>
         ) : (
-          <Link href="/login" className="text-sm font-semibold text-white md:text-lg">
+          <Link href="/login" className="text-base font-semibold text-white md:text-lg">
             로그인
           </Link>
         )}

diff --git a/src/components/common/input/button/floating-btn.stories.tsx b/src/components/common/input/button/floating-btn.stories.tsx
diff --git a/src/components/common/input/button/floating-btn.tsx b/src/components/common/input/button/floating-btn.tsx
diff --git a/tailwind.config.ts b/tailwind.config.ts
@@ -35,13 +35,14 @@ const config: Config = {
       },
       width: {
         7.5: '30px',
-        12.5: '50px',
+        12.5: '56px',
         18: '72px',
         27.5: '110px',
         29.5: '118px',
         30: '120px',
       },
       height: {
+        header: '50px',
         7.5: '30px',
         12.5: '50px',
         13: '52px',
@@ -160,13 +161,13 @@ const config: Config = {
             'scroll-snap-align': 'start',
           },
           '.sort-bg': {
-            'background-image': "url('./assets/icons/ic-sort.svg')",
+            'background-image': "url('../../public/assets/icons/ic-sort.svg')",
             'background-repeat': 'no-repeat',
             'background-position': '12px center',
             'background-size': '24px 24px',
           },
           '.sort-bg-on': {
-            'background-image': "url('./assets/icons/ic-sort-on.svg')",
+            'background-image': "url('../../public/assets/icons/ic-sort-on.svg')",
             'background-repeat': 'no-repeat',
             'background-position': '12px center',
             'background-size': '24px 24px',