From b5d300072f00acaf9e0cbcd0170e872c0f4fdfa4 Mon Sep 17 00:00:00 2001 From: simeunseo Date: Fri, 25 Aug 2023 04:39:57 +0900 Subject: [PATCH 1/2] =?UTF-8?q?feat:=20community=20=ED=83=AD=EC=97=90?= =?UTF-8?q?=EC=84=9C=EB=8A=94=20=EC=97=B0=ED=95=84=20=EC=95=84=EC=9D=B4?= =?UTF-8?q?=EC=BD=98=20=EB=B2=84=ED=8A=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/svgs/postBtn.svg | 22 ++++++++++++++++++++++ src/components/common/Footer.tsx | 20 +++++++++++++++++--- src/components/icon/icon.ts | 2 ++ 3 files changed, 41 insertions(+), 3 deletions(-) create mode 100644 src/assets/svgs/postBtn.svg diff --git a/src/assets/svgs/postBtn.svg b/src/assets/svgs/postBtn.svg new file mode 100644 index 0000000..6050366 --- /dev/null +++ b/src/assets/svgs/postBtn.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/components/common/Footer.tsx b/src/components/common/Footer.tsx index 3978c4b..494ed4d 100644 --- a/src/components/common/Footer.tsx +++ b/src/components/common/Footer.tsx @@ -3,6 +3,7 @@ import { Community, CommunityRed, Event, EventRed, Home, HomeRed, Volunteer, Vol import { IconArea } from '../icon/icon'; import { Link } from 'react-router-dom'; import { PlusBtn } from '../icon/icon'; +import { PostBtn } from '../icon/icon'; import React from 'react'; import { styled } from 'styled-components'; import { theme } from '../../styles/theme'; @@ -24,9 +25,15 @@ const Footer = () => { - - - + {location === '/community' ? ( + + + + ) : ( + + + + )} ); }; @@ -46,6 +53,13 @@ const StyledPlusBtn = styled(PlusBtn)` transform: translate(-3.7rem, 0); `; +const StyledPostBtn = styled(PostBtn)` + position: absolute; + bottom: 5.3rem; + left: 50%; + transform: translate(-3.7rem, 0); +`; + const IconContainer = styled.div` display: flex; position: absolute; diff --git a/src/components/icon/icon.ts b/src/components/icon/icon.ts index 15a41c4..81b2de4 100644 --- a/src/components/icon/icon.ts +++ b/src/components/icon/icon.ts @@ -31,6 +31,7 @@ import { ReactComponent as Invite } from '../../assets/svgs/invite.svg'; import { ReactComponent as MyPage } from '../../assets/svgs/myPage.svg'; import { ReactComponent as MypageBackground } from '../../assets/svgs/mypageBackground.svg'; import { ReactComponent as PlusBtn } from '../../assets/svgs/PlusBtn.svg'; +import { ReactComponent as PostBtn } from '../../assets/svgs/postBtn.svg'; import { ReactComponent as SecondPlace } from '../../assets/svgs/secondPlace.svg'; import { ReactComponent as ThirdPlace } from '../../assets/svgs/thirdPlace.svg'; import { ReactComponent as Trophy } from '../../assets/svgs/trophy.svg'; @@ -39,6 +40,7 @@ import { ReactComponent as Volunteer } from '../../assets/svgs/volunteer.svg'; import { ReactComponent as VolunteerRed } from '../../assets/svgs/volunteerRed.svg'; export { + PostBtn, VolunteerRed, HomeRed, EventRed, From 6b29c31749c6667ae5226b62674153fc9835d610 Mon Sep 17 00:00:00 2001 From: simeunseo Date: Fri, 25 Aug 2023 04:41:34 +0900 Subject: [PATCH 2/2] =?UTF-8?q?feat:=20=ED=99=88=20=EB=A7=88=EC=9D=B4?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EB=B2=84=ED=8A=BC=EC=97=90=20?= =?UTF-8?q?=EB=84=A4=EB=B9=84=EA=B2=8C=EC=9D=B4=EC=85=98=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/community/Header.tsx | 3 ++- src/components/home/RankTitle.tsx | 6 ++++-- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/src/components/community/Header.tsx b/src/components/community/Header.tsx index 2133a32..06a04b9 100644 --- a/src/components/community/Header.tsx +++ b/src/components/community/Header.tsx @@ -7,6 +7,7 @@ import { useRecoilState } from 'recoil'; const Header = () => { const [currentTap, setCurrentTap] = useRecoilState(communityTapState); + const handleTap = () => { setCurrentTap(!currentTap); }; @@ -51,7 +52,7 @@ const HeaderWrapper = styled.header` const HeaderTap = styled.div<{ $isCurrentTap: boolean }>` display: flex; justify-content: center; - border-bottom: 0.2rem solid ${(props) => (props.isCurrentTap ? theme.colors.deepred : theme.colors.gray01)}; + border-bottom: 0.2rem solid ${(props) => (props.$isCurrentTap ? theme.colors.deepred : theme.colors.gray01)}; cursor: pointer; width: 100%; height: 5.6rem; diff --git a/src/components/home/RankTitle.tsx b/src/components/home/RankTitle.tsx index 3ab3f7a..96db3b5 100644 --- a/src/components/home/RankTitle.tsx +++ b/src/components/home/RankTitle.tsx @@ -1,9 +1,9 @@ +import { Link } from 'react-router-dom'; import { MyPage } from '../icon/icon'; import React from 'react'; import Text from '../common/Text'; import { styled } from 'styled-components'; import { theme } from '../../styles/theme'; - const dummy = { university: '적십자대학교', name: '홍길동', @@ -26,7 +26,9 @@ const RankTitle = () => { - + + + ); };