feat: roomcard 레이아웃 수정

woowacourse-teams · Oct 23, 2024 · 0a93b2a · 0a93b2a
1 parent b700c25
commit 0a93b2a
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 10 deletions.
diff --git a/frontend/src/components/shared/roomCard/RoomCard.style.ts b/frontend/src/components/shared/roomCard/RoomCard.style.ts
@@ -114,7 +114,8 @@ export const NoKeywordText = styled.span`
 
 export const EtcContainer = styled.div`
   display: flex;
-  justify-content: space-between;
+  flex-direction: column;
+  gap: 0.6rem;
 `;
 
 export const JoinMember = styled.span`
@@ -150,8 +151,3 @@ export const LabelWrapper = styled.div`
   gap: 0.5rem;
   height: 53px;
 `;
-
-export const EtcWrapper = styled.div`
-  display: flex;
-  justify-content: space-between;
-`;
diff --git a/frontend/src/components/shared/roomCard/RoomCard.tsx b/frontend/src/components/shared/roomCard/RoomCard.tsx
@@ -94,15 +94,12 @@ const RoomCard = React.memo(({ roomInfo }: RoomCardProps) => {
 
           <S.EtcContainer>
             <S.LabelWrapper>{DisplayLabel(roomInfo)}</S.LabelWrapper>
-          </S.EtcContainer>
-
-          <S.EtcWrapper>
             <S.DeadLineText>{DisplayLeftTime(roomInfo)}</S.DeadLineText>
             <S.JoinMember>
               <Icon kind="person" size="1.8rem" color={theme.COLOR.grey4} />
               {roomInfo.reviewerCount + roomInfo.bothCount} / {roomInfo.limitedParticipants}
             </S.JoinMember>
-          </S.EtcWrapper>
+          </S.EtcContainer>
         </S.RoomInformation>
       </S.RoomCardContainer>
     </>