diff --git a/src/components/Common/GrayInfoBox.jsx b/src/components/Common/GrayInfoBox.jsx index 1d313a8..25e190a 100644 --- a/src/components/Common/GrayInfoBox.jsx +++ b/src/components/Common/GrayInfoBox.jsx @@ -9,7 +9,7 @@ export default GrayInfoBox; const Wrapper = styled.div` background-color: #f1f1f1; - height: 45px; + /* height: 45px; */ display: flex; align-items: center; padding-left: 18px; @@ -18,4 +18,6 @@ const Wrapper = styled.div` margin-top: 10px; border-radius: 15px; max-width: 310px; + padding-top: 11.5px; + padding-bottom: 11.5px; `; diff --git a/src/components/MainPage/SignInContent.jsx b/src/components/MainPage/SignInContent.jsx index 5284176..86624a6 100644 --- a/src/components/MainPage/SignInContent.jsx +++ b/src/components/MainPage/SignInContent.jsx @@ -136,8 +136,8 @@ function SignInContent() { type="radio" id="male" name="sex" - value={false} - checked={form.sex === false} + value={true} + checked={form.sex === true} onChange={handleChange} /> 남성 @@ -145,8 +145,8 @@ function SignInContent() { type="radio" id="female" name="sex" - value={true} - checked={form.sex === true} + value={false} + checked={form.sex === false} onChange={handleChange} /> 여성 diff --git a/src/components/UserPage/UserCompleteLetureContent.jsx b/src/components/UserPage/UserCompleteLetureContent.jsx index acfa61f..454d373 100644 --- a/src/components/UserPage/UserCompleteLetureContent.jsx +++ b/src/components/UserPage/UserCompleteLetureContent.jsx @@ -5,6 +5,7 @@ import CourseCard from "../Common/CourseCard"; import axios from "axios"; import { Link } from "react-router-dom"; import pickleImg from "../../assets/img/UserLevel0.svg"; +import grayPickle from "../../assets/img/grayUserLevel0.svg"; function UserCompleteLetureContent() { const [userData, setUserData] = useState(); @@ -61,24 +62,35 @@ function UserCompleteLetureContent() { {userData.nickname} 님! 지금까지 수강했던 강좌들이에요 총 {data.length}개를 수강했습니다 - - {data.map((data, index) => ( - - - - {index % 2 === 0 && } - - - ))} - + {data.length === 0 ? ( + + +
+ 회색 피클 이미지 + 아직 완료한 강좌가 없습니다. +
+
+
+ ) : ( + + {data.map((data, index) => ( + + + + {index % 2 === 0 && } + + + ))} + + )}
); @@ -131,3 +143,25 @@ const LoadingText = styled.div` margin-top: 30px; font-size: 20px; `; + +const NoCourse = styled.div` + display: flex; + margin-left: 350px; + margin-top: 60px; + height: 500px; + width: 1040px; + /* border: 1px solid red; */ + + img { + height: 200px; + padding-left: 50px; + /* border: 1px solid red; */ + } +`; + +const NoCourseText = styled.div` + font-size: 20px; + margin-top: 10px; + color: #9c9c9c; + padding-left: 20px; +`; diff --git a/src/components/UserPage/UserEditProfileContent.jsx b/src/components/UserPage/UserEditProfileContent.jsx index 81818aa..8d0921c 100644 --- a/src/components/UserPage/UserEditProfileContent.jsx +++ b/src/components/UserPage/UserEditProfileContent.jsx @@ -185,7 +185,7 @@ function UserEditProfileContent() { 성별
- {formData.sex ? "여성" : "남성"} + {formData.sex ? "남성" : "여성"}
전화번호 diff --git a/src/components/UserPage/UserLearningContent.jsx b/src/components/UserPage/UserLearningContent.jsx index 0fe72e4..881a6e3 100644 --- a/src/components/UserPage/UserLearningContent.jsx +++ b/src/components/UserPage/UserLearningContent.jsx @@ -5,6 +5,7 @@ import CourseDivideLine from "../Common/CourseDivideLine"; import axios from "axios"; import { Link } from "react-router-dom"; import pickleImg from "../../assets/img/UserLevel0.svg"; +import grayPickle from "../../assets/img/grayUserLevel0.svg"; function UserLearningContent() { const [userData, setUserData] = useState(); @@ -56,25 +57,36 @@ function UserLearningContent() { return ( - {userData.nickname} 님! 현재 수강 중인 강좌예요 - - {data.map((data, index) => ( - - - - {index % 2 === 0 && } - - - ))} - + {userData.nickname} 님! 현재 수강 중인 강좌에요 + {data.length === 0 ? ( + + +
+ 회색 피클 이미지 + 아직 수강 중인 강좌가 없습니다. +
+
+
+ ) : ( + + {data.map((data, index) => ( + + + + {index % 2 === 0 && } + + + ))} + + )}
); @@ -121,3 +133,24 @@ const LoadingText = styled.div` margin-top: 30px; font-size: 20px; `; + +const NoCourse = styled.div` + display: flex; + margin-left: 350px; + margin-top: 90px; + height: 500px; + width: 1040px; + /* border: 1px solid red; */ + + img { + height: 200px; + padding-left: 50px; + /* border: 1px solid red; */ + } +`; + +const NoCourseText = styled.div` + font-size: 20px; + margin-top: 10px; + color: #9c9c9c; +`; diff --git a/src/components/UserPage/UserSavedLectureContent.jsx b/src/components/UserPage/UserSavedLectureContent.jsx index 3cb5771..07bf3eb 100644 --- a/src/components/UserPage/UserSavedLectureContent.jsx +++ b/src/components/UserPage/UserSavedLectureContent.jsx @@ -5,6 +5,7 @@ import CourseDivideLine from "../Common/CourseDivideLine"; import pickleImg from "../../assets/img/UserLevel0.svg"; import axios from "axios"; import { Link } from "react-router-dom"; +import grayPickle from "../../assets/img/grayUserLevel0.svg"; function UserSavedLectureContent() { const [data, setData] = useState(); @@ -52,24 +53,35 @@ function UserSavedLectureContent() { {userData.nickname} 님! 찜한 강좌들이에요 - - {data?.map((data, index) => ( - - - - {index % 2 === 0 && } - - - ))} - + {data.length === 0 ? ( + + +
+ 회색 피클 이미지 + 아직 찜한 강좌가 없습니다. +
+
+
+ ) : ( + + {data.map((course, index) => ( + + + + {index % 2 === 0 && } + + + ))} + + )}
); @@ -116,3 +128,24 @@ const LoadingText = styled.div` margin-top: 30px; font-size: 20px; `; + +const NoCourse = styled.div` + display: flex; + margin-left: 370px; + margin-top: 90px; + height: 500px; + width: 1040px; + /* border: 1px solid red; */ + + img { + height: 200px; + padding-left: 30px; + /* border: 1px solid red; */ + } +`; + +const NoCourseText = styled.div` + font-size: 20px; + margin-top: 10px; + color: #9c9c9c; +`;