From 29143192d07ff318fc872395d4d1beabbbe3819a Mon Sep 17 00:00:00 2001 From: seoye0ng Date: Tue, 16 Jan 2024 18:23:14 +0900 Subject: [PATCH 01/17] =?UTF-8?q?asset:=20heart,=20search=20svg=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80=20=EB=B0=8F=20=EB=B3=80=EA=B2=BD=20#80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/assets/icons/heart.svg | 3 +++ public/assets/icons/search.svg | 4 ++-- 2 files changed, 5 insertions(+), 2 deletions(-) create mode 100644 public/assets/icons/heart.svg diff --git a/public/assets/icons/heart.svg b/public/assets/icons/heart.svg new file mode 100644 index 00000000..2944da5e --- /dev/null +++ b/public/assets/icons/heart.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/assets/icons/search.svg b/public/assets/icons/search.svg index a69090da..44315c64 100644 --- a/public/assets/icons/search.svg +++ b/public/assets/icons/search.svg @@ -1,3 +1,3 @@ - - + + From 3a9ccfcc6e2be8937e7ced4816ffc283cba663d2 Mon Sep 17 00:00:00 2001 From: seoye0ng Date: Tue, 16 Jan 2024 18:24:47 +0900 Subject: [PATCH 02/17] =?UTF-8?q?design:=20Logo=20=EC=95=84=EC=9D=B4?= =?UTF-8?q?=EC=BD=98=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=88=98?= =?UTF-8?q?=EC=A0=95=20#80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/icons/Logo.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/icons/Logo.tsx b/src/components/icons/Logo.tsx index 2fae0684..3f2e3cdc 100644 --- a/src/components/icons/Logo.tsx +++ b/src/components/icons/Logo.tsx @@ -12,8 +12,9 @@ function Logo({ }: LogoProps) { return ( - + + ); } From cf718832699c4662189e65647b33d54f2a694e04 Mon Sep 17 00:00:00 2001 From: seoye0ng Date: Tue, 16 Jan 2024 18:25:55 +0900 Subject: [PATCH 03/17] =?UTF-8?q?design:=20Share,=20BackArrow=20=EC=95=84?= =?UTF-8?q?=EC=9D=B4=EC=BD=98=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20?= =?UTF-8?q?=ED=81=AC=EA=B8=B0=20=EC=88=98=EC=A0=95=20#80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/icons/BackArrow.tsx | 2 +- src/components/icons/Share.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/icons/BackArrow.tsx b/src/components/icons/BackArrow.tsx index cf002ab5..2a4f5d23 100644 --- a/src/components/icons/BackArrow.tsx +++ b/src/components/icons/BackArrow.tsx @@ -8,7 +8,7 @@ interface BackProps { } function BackArrow({ - width = 9, height = 16, color = 'black', onClick, + width = 7, height = 14, color = 'black', onClick, }:BackProps) { return ( diff --git a/src/components/icons/Share.tsx b/src/components/icons/Share.tsx index 5997d0c7..08f171f3 100644 --- a/src/components/icons/Share.tsx +++ b/src/components/icons/Share.tsx @@ -8,7 +8,7 @@ interface ShareProps { } function Share({ - width = 18, height = 20, color = 'black', onClick, + width = 16, height = 18, color = 'black', onClick, }: ShareProps) { return ( From e6316264858df8b7b572aa8f8bb1a975ccb7c712 Mon Sep 17 00:00:00 2001 From: seoyeong Date: Tue, 16 Jan 2024 18:58:24 +0900 Subject: [PATCH 04/17] =?UTF-8?q?design:=20Search=20=EC=95=84=EC=9D=B4?= =?UTF-8?q?=EC=BD=98=20=EB=B3=80=EA=B2=BD=20#80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/icons/Search.tsx | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/components/icons/Search.tsx b/src/components/icons/Search.tsx index f2bd924e..f241c80b 100644 --- a/src/components/icons/Search.tsx +++ b/src/components/icons/Search.tsx @@ -5,11 +5,13 @@ interface SearchProps { color?: Colors } -function Search({ size = 17, color = 'gray300' }: SearchProps) { +function Search({ size = 18, color = 'black' }: SearchProps) { return ( - - + + + + ); } From 2c146e7c5d4f4ee99576ea8922156fabb1806cff Mon Sep 17 00:00:00 2001 From: seoyeong Date: Tue, 16 Jan 2024 18:59:41 +0900 Subject: [PATCH 05/17] =?UTF-8?q?design:=20Header=20CSS=20=EC=88=98?= =?UTF-8?q?=EC=A0=95=20#80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../shared/header/Header.module.scss | 18 ++++++++++++------ 1 file changed, 12 insertions(+), 6 deletions(-) diff --git a/src/components/shared/header/Header.module.scss b/src/components/shared/header/Header.module.scss index e3ba8b3d..50a82c81 100644 --- a/src/components/shared/header/Header.module.scss +++ b/src/components/shared/header/Header.module.scss @@ -5,7 +5,7 @@ $white: var(--white); top: 0; box-sizing: border-box; width: 100%; - height: 48px; + height: 44px; background-color: $white; &.transparent { @@ -29,21 +29,26 @@ $white: var(--white); } .container { + align-items: center; justify-content: space-between; width: inherit; height: inherit; margin: 0; + ul.left { + & > li:first-child { + margin-right: 12.5px; + } + } + li.logo { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -45%); + height: fit-content; + transform: translateY(2px); } ul.right { display: flex; - gap: 18px; + gap: 13px; align-items: center; } @@ -51,6 +56,7 @@ $white: var(--white); margin-left: auto; a { + transform: translateY(2px); text-decoration: none; } } From 80b57f8a4e3479680301e38bef7301d9ce9efe42 Mon Sep 17 00:00:00 2001 From: seoyeong Date: Tue, 16 Jan 2024 19:01:07 +0900 Subject: [PATCH 06/17] =?UTF-8?q?test:=20Header=20storybook=20=EC=88=98?= =?UTF-8?q?=EC=A0=95=20#80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/shared/header/Header.stories.tsx | 14 +------------- 1 file changed, 1 insertion(+), 13 deletions(-) diff --git a/src/components/shared/header/Header.stories.tsx b/src/components/shared/header/Header.stories.tsx index 13f00e80..57ca132b 100644 --- a/src/components/shared/header/Header.stories.tsx +++ b/src/components/shared/header/Header.stories.tsx @@ -7,13 +7,11 @@ const meta = { component: Header, tags: ['autodocs'], args: { - isLogin: false, displayLogo: true, isTransparent: false, displayRightIcon: false, }, argTypes: { - isLogin: { control: 'boolean' }, displayLogo: { control: 'boolean' }, isTransparent: { control: 'boolean' }, displayRightIcon: { control: 'boolean' }, @@ -23,18 +21,8 @@ const meta = { export default meta; type Story = StoryObj; -export const LoggedIn:Story = { +export const MainPage:Story = { args: { - isLogin: true, - displayLogo: true, - isTransparent: false, - displayRightIcon: false, - }, -}; - -export const LoggedOut:Story = { - args: { - isLogin: false, displayLogo: true, isTransparent: false, displayRightIcon: false, From 0a82e755d7227ac7610c8ddd8b5b167b7d570e88 Mon Sep 17 00:00:00 2001 From: seoyeong Date: Tue, 16 Jan 2024 19:02:50 +0900 Subject: [PATCH 07/17] =?UTF-8?q?design:=20Header=20=EC=BB=B4=ED=8F=AC?= =?UTF-8?q?=EB=84=8C=ED=8A=B8=20=EC=88=98=EC=A0=95=20#80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/shared/header/Header.tsx | 6 ++-- .../shared/header/headerItems/LeftIcon.tsx | 17 ++++++++--- .../shared/header/headerItems/RightIcon.tsx | 29 ++++++++++++------- 3 files changed, 33 insertions(+), 19 deletions(-) diff --git a/src/components/shared/header/Header.tsx b/src/components/shared/header/Header.tsx index dd732dfe..04734f22 100644 --- a/src/components/shared/header/Header.tsx +++ b/src/components/shared/header/Header.tsx @@ -7,18 +7,16 @@ import RightIcon from './headerItems/RightIcon'; import { HeaderProps } from './types/headerType'; export default function Header({ - isLogin = false, - displayLogo = true, isTransparent = false, displayRightIcon = false, + displayLogo = false, isTransparent = false, displayRightIcon = true, }:HeaderProps) { const cx = classNames.bind(styles); return (