diff --git a/src/components/Button/LinkButton.tsx b/src/components/Button/LinkButton.tsx index 18e71381..e0e242b2 100644 --- a/src/components/Button/LinkButton.tsx +++ b/src/components/Button/LinkButton.tsx @@ -9,7 +9,7 @@ interface Props { children: React.ReactNode; route: string; disabled?: boolean; - theme?: 'normal' | 'light' | 'gray'; + theme?: 'normal' | 'light' | 'gray' | 'ghost'; extraClass?: string; isReplace?: boolean; } diff --git a/src/features/Profile/components/Feed/NoProfileFeed.tsx b/src/features/Profile/components/Feed/NoProfileFeed.tsx index 1e29a78a..d5aee8f0 100644 --- a/src/features/Profile/components/Feed/NoProfileFeed.tsx +++ b/src/features/Profile/components/Feed/NoProfileFeed.tsx @@ -1,7 +1,11 @@ import Image from 'next/image'; import { IMAGES } from '@/constants/images'; +import Button from '@/components/Button/Button'; +import { useCustomRouter } from '@/hooks/useCustomRouter'; +import { PAGES } from '@/constants/page'; function NoProfileFeed() { + const { navigate } = useCustomRouter('profile'); return (
+ ); } diff --git a/src/features/Profile/components/Profile/Profile.tsx b/src/features/Profile/components/Profile/Profile.tsx index fbeb920e..235609d0 100644 --- a/src/features/Profile/components/Profile/Profile.tsx +++ b/src/features/Profile/components/Profile/Profile.tsx @@ -21,7 +21,7 @@ function Profile({ userId, isRootUser = false, profileDetail }: Props) { {isRootUser && (
- + 프로필 편집
diff --git a/src/features/Profile/components/Profile/ProfilePageHeader.tsx b/src/features/Profile/components/Profile/ProfilePageHeader.tsx index 0c965d15..5715c4cc 100644 --- a/src/features/Profile/components/Profile/ProfilePageHeader.tsx +++ b/src/features/Profile/components/Profile/ProfilePageHeader.tsx @@ -15,15 +15,17 @@ function ProfilePageHeader({ isRootUser, userId }: Props) { return ( {isRootUser && ( - - - +
+ + + +
)}
); diff --git a/src/styles/buttons.css b/src/styles/buttons.css index 026744c6..31b5e270 100644 --- a/src/styles/buttons.css +++ b/src/styles/buttons.css @@ -19,6 +19,9 @@ .button-error { @apply button-common bg-error text-white; } + .button-ghost { + @apply button-common border border-main bg-white text-main; + } .add-button-wrapper { @apply w-full px-page pb-[24px]; } diff --git a/src/utils/getButtonColor.ts b/src/utils/getButtonColor.ts index 1d231f6f..d77ff513 100644 --- a/src/utils/getButtonColor.ts +++ b/src/utils/getButtonColor.ts @@ -11,6 +11,8 @@ export const getButtonColor = (theme: string) => { return 'button-gray'; case 'light': return 'button-light'; + case 'ghost': + return 'button-ghost'; default: return `button-common ${theme}`; }