diff --git a/src/components/Banner.tsx b/src/components/Banner.tsx index 9a45023..9c95732 100644 --- a/src/components/Banner.tsx +++ b/src/components/Banner.tsx @@ -65,6 +65,7 @@ const SwiperContainer = styled.div` background-color: ${colors.mainGray}; border-radius: 10px; box-shadow: 0px 5px 5px -3px rgba(255, 255, 255, 0.5); + padding-top: 16px; .swiper-pagination { bottom: 10px !important; diff --git a/src/components/BestContents.tsx b/src/components/BestContents.tsx index b3f4e4f..c899aec 100644 --- a/src/components/BestContents.tsx +++ b/src/components/BestContents.tsx @@ -50,8 +50,8 @@ const BestContents = () => { } const Container = styled.div` - width: 344px; - height: 181px; + width: 280px; + height: 160px; background-color: ${colors.mainGray}; border-radius: 10px; box-shadow: 0px 5px 5px -3px rgba(255, 255, 255, 0.5); @@ -60,7 +60,7 @@ const Container = styled.div` .title { color: ${colors.primaryBlue}; - font-size: ${fontSize.xl}; + font-size: ${fontSize.lg}; font-weight: ${fontWeight.semiBold}; margin-bottom: 22px; } @@ -69,7 +69,7 @@ const Ranking = styled.div` .list-container { display: flex; justify-content: space-between; - font-size: ${fontSize.lg}; + font-size: ${fontSize.sm}; font-weight: ${fontWeight.semiBold}; margin-bottom: 18px; diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx index 90ff44a..0a10a67 100644 --- a/src/pages/Home.tsx +++ b/src/pages/Home.tsx @@ -5,6 +5,7 @@ import Banner from '@components/Banner' import colors from '@/constants/color' import { fontSize, fontWeight } from '@/constants/font' import { useNavigate } from 'react-router-dom' +import { useAuthStore } from '@/stores/authStore' const postData = [ { @@ -66,6 +67,7 @@ const postData = [ ] const Home: React.FC = () => { + const { isLogin } = useAuthStore() const navigate = useNavigate() return ( @@ -77,14 +79,16 @@ const Home: React.FC = () => {
코딩테스트
스터디
- + {isLogin && ( + + )}
Lv.0
@@ -123,7 +127,7 @@ const Container = styled.div` width: 100%; height: 100%; background-color: ${colors.bgBlack}; - max-width: 1280px; + max-width: 1080px; margin: 20px auto; ` const ContentContainer = styled.div` @@ -137,8 +141,9 @@ const PostContainer = styled.div` border-right: 1px solid ${colors.white}; .newest-posts { - max-height: 800px; - overflow-y: scroll; + padding-right: 60px; + max-height: 80%; + overflow-y: auto; } .menu { diff --git a/src/styles/GlobalStyles.tsx b/src/styles/GlobalStyles.tsx index cc4b358..b24669c 100644 --- a/src/styles/GlobalStyles.tsx +++ b/src/styles/GlobalStyles.tsx @@ -196,6 +196,7 @@ const GlobalStyles = () => ( height: 100%; width: 100%; overflow-y: auto; + background-color: ${colors.bgBlack}; } `} />