design: 상세 페이지 설명 글씨 줄이고 키워드 글씨 키우기

woowacourse-teams · Nov 15, 2024 · 1a3eec1 · 1a3eec1
1 parent d93f379
commit 1a3eec1
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 9 deletions.
diff --git a/frontend/src/components/common/label/Label.style.ts b/frontend/src/components/common/label/Label.style.ts
@@ -60,12 +60,7 @@ export const LabelWrapper = styled.div<LabelWrapperProps>`
         `;
       case "MANAGER":
         return css`
-          display: flex;
           gap: 0.4rem;
-
-          font: ${({ theme }) => theme.TEXT.small};
-          color: ${theme.COLOR.black};
-
           background-color: ${theme.COLOR.grey0};
           border: 1px solid ${theme.COLOR.grey0};
         `;

diff --git a/frontend/src/components/roomDetailPage/roomInfoCard/RoomInfoCard.style.ts b/frontend/src/components/roomDetailPage/roomInfoCard/RoomInfoCard.style.ts
@@ -121,9 +121,9 @@ export const NoKeywordText = styled.span`
 `;
 
 export const RoomContentSmall = styled.div`
-  font: ${({ theme }) => theme.TEXT.small_bold};
+  font: ${({ theme }) => theme.TEXT.semiSmall};
   line-height: normal;
-  color: ${({ theme }) => theme.COLOR.black};
+  color: ${({ theme }) => theme.COLOR.grey4};
   white-space: pre-line;
 `;
 

diff --git a/frontend/src/components/roomDetailPage/roomInfoCard/RoomInfoCard.tsx b/frontend/src/components/roomDetailPage/roomInfoCard/RoomInfoCard.tsx
@@ -42,7 +42,7 @@ const RoomInfoCard = ({ roomInfo }: { roomInfo: RoomInfo }) => {
 
         <S.RoomContentBox>
           <S.RoomTagBox>
-            <Label type="MANAGER" managerText={roomInfo.manager} />
+            <Label type="MANAGER" managerText={roomInfo.manager} size="semiSmall_bold" />
             {displayedKeywords.length === 0 ? (
               <S.NoKeywordText>지정된 키워드 없음</S.NoKeywordText>
             ) : (
@@ -51,7 +51,7 @@ const RoomInfoCard = ({ roomInfo }: { roomInfo: RoomInfo }) => {
                   key={keyword}
                   type="KEYWORD"
                   text={keyword}
-                  size="small"
+                  size="semiSmall_bold"
                   backgroundColor={theme.COLOR.primary1}
                 />
               ))