feat/RECODE01#6/mypage save

joogle-ay · Jul 6, 2022 · f5c604e · f5c604e
1 parent c2fe5d6
commit f5c604e
Showing 1 changed file with 39 additions and 3 deletions.
diff --git a/src/component/unit/mypage/mypage.mockup.html b/src/component/unit/mypage/mypage.mockup.html
@@ -9,17 +9,53 @@
     <title>Mypage Mock Up</title>
     <link rel="stylesheet" href="./mypage.style.css">
     <link rel="stylesheet" href="../../../styles/global.style.css">
+    <script src="https://kit.fontawesome.com/116a85af51.js" crossorigin="anonymous"></script>
 </head>
 <body>
     <div class="container">
         <header class="header">
-
+            <h1 class="header__title">
+                마이페이지
+            </h1>
         </header>
         <main class="contents">
-
+            <section class="user-info">
+                <h2>유저 정보가 들어가는 영역</h2>
+            </section>
+            <section class="challenge-list">
+                <h1>챌린지 목록이 들어가는 영역</h1>
+            </section>
         </main>
         <nav class="nav">
-
+            <ul class="nav__ul">
+                <!-- 폰트어썸 문제 해결해야함
+                토요일에 가서 이야기해보자 -->
+                <li class="nav__ul__li">
+                    <a href="#" data-pathname="todolist">
+                        <i class="fa-solid fa-pen-to-square"></i>
+                    </a>
+                </li>
+                <li class="nav__ul__li">
+                    <a href="#" data-pathname="challenge">
+                        <i class="fa-solid fa-flag"></i>
+                    </a>
+                </li>
+                <li class="nav__ul__li">
+                    <button>
+                        <i class="fa-solid fa-circle-plus"></i>
+                    </button>
+                </li>
+                <li class="nav__ul__li">
+                    <a href="#" data-pathname="community">
+                        <i class="fa-solid fa-list-check"></i>
+                    </a>
+                </li>
+                <li class="nav__ul__li">
+                    <a href="#" data-pathname="mypage">
+                        <i class="fa-solid fa-circle-user"></i>
+                    </a>
+                </li>
+            </ul>
         </nav>
     </div>
 </body>