diff --git a/public/assets/background_.svg b/public/assets/background_.svg new file mode 100644 index 0000000..46b03c8 --- /dev/null +++ b/public/assets/background_.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/assets/bannerMain.svg b/public/assets/bannerMain.svg index a53a943..9312bd5 100644 --- a/public/assets/bannerMain.svg +++ b/public/assets/bannerMain.svg @@ -1,6 +1,6 @@
- + diff --git a/src/pages/main/Board.tsx b/src/pages/main/Board.tsx new file mode 100644 index 0000000..98b1fc2 --- /dev/null +++ b/src/pages/main/Board.tsx @@ -0,0 +1,18 @@ +import { Header } from '@/shared/components'; + +import Boardgame from '@/pages/main/components/board/Boardgame'; +import router from 'next/router'; + +const Board = () => { + return ( +
+
router.back()} /> + +
+ +
+
+ ); +}; + +export default Board; diff --git a/src/pages/main/components/.gitkeep b/src/pages/main/components/.gitkeep deleted file mode 100644 index e69de29..0000000 diff --git a/src/pages/main/components/board/Boardgame.tsx b/src/pages/main/components/board/Boardgame.tsx new file mode 100644 index 0000000..4bf2ef4 --- /dev/null +++ b/src/pages/main/components/board/Boardgame.tsx @@ -0,0 +1,43 @@ +'use client'; +import Image from 'next/image'; +import { boardData } from '@/shared/constants/main/boardData'; + +const Boardgame = () => { + return ( +
+ board background + +
+ {boardData.map((row, r) => + row.map((cell, c) => { + const key = `cell-${r}-${c}`; + + if (!cell.active) { + return
; + } + + return ( +
console.log(cell.label)}>
+ ); + }), + )} +
+
+ ); +}; + +export default Boardgame; diff --git a/src/pages/main/components/stampBoard/Stamp.tsx b/src/pages/main/components/stampBoard/Stamp.tsx index 755c197..269ef2f 100644 --- a/src/pages/main/components/stampBoard/Stamp.tsx +++ b/src/pages/main/components/stampBoard/Stamp.tsx @@ -12,19 +12,22 @@ const Stamp = ({ index, acquired, className }: StampProps) => { return (
- +
); } return (
); diff --git a/src/pages/main/index.tsx b/src/pages/main/index.tsx index 2ee70f4..124672f 100644 --- a/src/pages/main/index.tsx +++ b/src/pages/main/index.tsx @@ -2,18 +2,24 @@ import { cn } from '@/shared/lib'; import StampBoard from './components/stampBoard/StampBoard'; import { ControlBar } from '@/shared/components'; import Image from 'next/image'; +import router from 'next/router'; +import { BottomNav } from '@/shared/components/tab/BottomNav'; export default function MainPage() { return ( -
+
{}} userName='글다' - className='fixed top-[0.6rem] left-0 right-0 z-50 px-[2rem]' + className='fixed top-[1rem] left-0 right-0 z-50 px-[2rem]' /> -
+
{ - /* TODO: 페이지 이동 */ + router.push('/main/Board'); }} >
- +
+
); } diff --git a/src/shared/components/tab/BottomNav.tsx b/src/shared/components/tab/BottomNav.tsx index a471ac8..b998b91 100644 --- a/src/shared/components/tab/BottomNav.tsx +++ b/src/shared/components/tab/BottomNav.tsx @@ -23,15 +23,15 @@ export const BottomNav = () => { return (