diff --git a/public/icons/_moon.svg b/public/icons/_moon.svg index aba22cf..14e5464 100644 --- a/public/icons/_moon.svg +++ b/public/icons/_moon.svg @@ -1,3 +1,3 @@ - + diff --git a/public/icons/_paper-plane-darkmode.svg b/public/icons/_paper-plane-darkmode.svg index 5ab78d9..246a5f8 100644 --- a/public/icons/_paper-plane-darkmode.svg +++ b/public/icons/_paper-plane-darkmode.svg @@ -1,5 +1,5 @@ - - - + + + diff --git a/public/icons/_paper-plane.svg b/public/icons/_paper-plane.svg index d598a95..6c73682 100644 --- a/public/icons/_paper-plane.svg +++ b/public/icons/_paper-plane.svg @@ -1,5 +1,5 @@ - - - + + + diff --git a/public/icons/_sun.svg b/public/icons/_sun.svg index d3aed0f..68e6943 100644 --- a/public/icons/_sun.svg +++ b/public/icons/_sun.svg @@ -1,14 +1,14 @@ - - - - - - - - - + + + + + + + + + diff --git a/public/icons/notice.svg b/public/icons/notice.svg index 4224da0..254524c 100644 --- a/public/icons/notice.svg +++ b/public/icons/notice.svg @@ -1,3 +1,3 @@ - + diff --git a/src/components/navbar.js b/src/components/navbar.js index 7335784..4341662 100644 --- a/src/components/navbar.js +++ b/src/components/navbar.js @@ -75,6 +75,7 @@ function Navbar() { }) .then((res) => { const USER = res.data.user; + // console.log(USER); setProfileImg(USER.userImg); setNickname(USER.userNickname); setEmail(USER.userEmail); @@ -87,7 +88,7 @@ function Navbar() {
- + 홈 @@ -102,33 +103,177 @@ function Navbar() {
{!isDark && ( - + width="16" + height="16" + viewBox="0 0 13 13" + fill="none" + xmlns="http://www.w3.org/2000/svg" + > + + + + + + + + + + + + + + + + + + + // )} {isDark && ( - + width="16" + height="16" + viewBox="0 0 13 13" + fill="none" + xmlns="http://www.w3.org/2000/svg" + > + + + + // )} - + + + + {/* + > */} {profileImg === null && ( - + width="40" + height="40" + viewBox="0 0 40 40" + fill="none" + xmlns="http://www.w3.org/2000/svg" + > + + + + + + + + + + + // )} {profileImg !== null && ( Today's @@ -42,15 +42,15 @@ function NavbarHome() { Statistics diff --git a/src/pages/Home.js b/src/pages/Home.js index 014c01b..4758628 100644 --- a/src/pages/Home.js +++ b/src/pages/Home.js @@ -1,12 +1,50 @@ -import React from "react"; +import axios from "axios"; +import React, { useEffect, useState } from "react"; import { Outlet } from "react-router-dom"; import NavbarHome from "../components/navbarHome"; +import isLogin from "../utils/isLogin"; export default function Home() { - console.log("home"); + const TOKEN = localStorage.getItem("accessToken"); + + const [nickname, setNickname] = useState(""); + const [email, setEmail] = useState(""); + const [profileImg, setProfileImg] = useState(""); + const [Level, setLevel] = useState(""); + const [levelImagae, setLevelImage] = useState(""); + const [profileMsg, setProfileMsg] = useState(""); + const [timeGoal, setTimeGoal] = useState(""); + + useEffect(() => { + if (isLogin()) { + axios + .get("/users", { + headers: { + Authorization: `Bearer ${TOKEN}`, + }, + }) + .then((res) => { + const USER = res.data.user; + setNickname(USER.userNickname); + setEmail(USER.userEmail); + setProfileImg(USER.userImg); + setLevel(USER.userLevel.levelName); + setLevelImage(USER.userImageLevel.levelImg); + setProfileMsg(USER.userProfileMsg); + setTimeGoal(USER.userTimeGoal); + }); + } + }); + return (
+
+
+
+
+
+
); diff --git a/src/statics/css/home.css b/src/statics/css/home.css new file mode 100644 index 0000000..e826839 --- /dev/null +++ b/src/statics/css/home.css @@ -0,0 +1,3 @@ + + +/*# sourceMappingURL=home.css.map */ diff --git a/src/statics/css/home.css.map b/src/statics/css/home.css.map new file mode 100644 index 0000000..fc640df --- /dev/null +++ b/src/statics/css/home.css.map @@ -0,0 +1 @@ +{"version":3,"sourceRoot":"","sources":[],"names":[],"mappings":"","file":"home.css"} \ No newline at end of file diff --git a/src/statics/scss/home.scss b/src/statics/scss/home.scss new file mode 100644 index 0000000..e69de29