Skip to content

Commit 60475b5

Browse files
committed
refactor: 다크모드 수정
1 parent 60aab2f commit 60475b5

File tree

4 files changed

+4
-67
lines changed

4 files changed

+4
-67
lines changed

frontend/src/component/molecule/DarkModeButton.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export default function DarkModeButton({ animate }: Props) {
1414
return (
1515
<motion.button
1616
onClick={toggleDarkMode}
17-
className='pointer-events-auto absolute flex h-[30px] w-[30px] items-center justify-center rounded-full hover:scale-110'
17+
className='pointer-events-auto flex h-[50px] w-[50px] items-center justify-center rounded-full hover:scale-150'
1818
animate={animate}>
1919
<Img
2020
src={FaviconImg}

frontend/src/component/molecule/NavbarTitle.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
1-
import FaviconImg from '@asset/image/Favicon.svg';
21
import H1 from '@component/atom/H1';
3-
import Img from '@component/atom/Img';
2+
import DarkModeButton from '@component/molecule/DarkModeButton';
43
import { useNavigate } from 'react-router-dom';
54

65
export default function NavbarTitle() {
@@ -12,8 +11,8 @@ export default function NavbarTitle() {
1211

1312
return (
1413
<div className='my-2 w-full'>
15-
<div className='flex min-w-0 cursor-pointer items-center gap-2' onClick={navigateMain}>
16-
<Img src={FaviconImg} cssOption='w-[36px]' alt='와치덕스 로고 이미지' />
14+
<div className='flex min-w-0 cursor-pointer items-center' onClick={navigateMain}>
15+
<DarkModeButton />
1716
<H1 cssOption='font-bold text-[1.6vw] truncate dark:text-white' content='WatchDucks' />
1817
</div>
1918
</div>
Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,14 @@
11
import CustomErrorBoundary from '@boundary/CustomErrorBoundary';
2-
import DarkModeButton from '@component/molecule/DarkModeButton';
32
import NavbarCustomSelect from '@component/molecule/NavbarCustomSelect';
43
import NavbarDefaultSelect from '@component/molecule/NavbarDefaultSelect';
54
import { PATH } from '@constant/Path';
6-
import { useDuckAnimation } from '@hook/useDarkModeAnimation';
75
import { useRef } from 'react';
86
import { useLocation } from 'react-router-dom';
97

108
export default function NavbarSelectWrapper() {
119
const { pathname } = useLocation();
1210
const isProjectPath = pathname.includes(PATH.PROJECT);
1311
const containerRef = useRef<HTMLDivElement>(null);
14-
const duckAnimation = useDuckAnimation({ containerRef });
15-
1612
return (
1713
<div className='relative mt-[8px] w-full'>
1814
<div ref={containerRef}>
@@ -24,9 +20,6 @@ export default function NavbarSelectWrapper() {
2420
</CustomErrorBoundary>
2521
)}
2622
</div>
27-
<div className='pointer-events-none absolute left-0 top-0 h-full w-full'>
28-
<DarkModeButton animate={duckAnimation} />
29-
</div>
3023
</div>
3124
);
3225
}

frontend/src/hook/useDarkModeAnimation.ts

Lines changed: 0 additions & 55 deletions
This file was deleted.

0 commit comments

Comments
 (0)