Merge pull request #131 from woowacourse-teams/fix/#130

style 에러 수정
woowacourse-teams · Jul 25, 2024 · cacb013 · cacb013
2 parents 71744eb + 86e6ca2
commit cacb013
Show file tree

Hide file tree

Showing 6 changed files with 33 additions and 21 deletions.
diff --git a/frontend/src/common/font.style.ts b/frontend/src/common/font.style.ts
@@ -12,66 +12,66 @@ import pretendardVariableWoff2 from './assets/fonts/woff2/PretendardVariable.wof
 
 const fonts = css`
   @font-face {
-    font-family: 'Pretendard';
+    font-family: Pretendard;
     font-weight: 900;
     font-display: swap;
     src: url(${pretendardBlackWoff2}) format('woff2');
   }
 
   @font-face {
-    font-family: 'Pretendard';
+    font-family: Pretendard;
     font-weight: 800;
     font-display: swap;
     src: url(${pretendardExtraBoldWoff2}) format('woff2');
   }
 
   @font-face {
-    font-family: 'Pretendard';
+    font-family: Pretendard;
     font-weight: 700;
     font-display: swap;
     src: url(${pretendardBoldWoff2}) format('woff2');
   }
 
   @font-face {
-    font-family: 'Pretendard';
+    font-family: Pretendard;
     font-weight: 600;
     font-display: swap;
     src: url(${pretendardSemiboldWoff2}) format('woff2');
   }
 
   @font-face {
-    font-family: 'Pretendard';
+    font-family: Pretendard;
     font-weight: 500;
     font-display: swap;
     src:
       local('Pretendard Medium'),
       url(${pretendardMediumWoff2}) format('woff2'),
-      url(./woff-subset/Pretendard-Medium.subset.woff) format('woff');
+      url("./woff-subset/Pretendard-Medium.subset.woff") format('woff');
   }
 
   @font-face {
-    font-family: 'Pretendard';
+    font-family: Pretendard;
     font-weight: 400;
     font-display: swap;
     src: url(${pretendardRegularWoff2}) format('woff2');
   }
 
   @font-face {
-    font-family: 'Pretendard';
+    font-family: Pretendard;
     font-weight: 300;
     font-display: swap;
     src: url(${pretendardLightWoff2}) format('woff2');
   }
 
   @font-face {
-    font-family: 'Pretendard';
+    font-family: Pretendard;
     font-weight: 200;
     font-display: swap;
     src: url(${pretendardExtraLightWoff2}) format('woff2');
   }
 
   @font-face {
-    font-family: 'Pretendard';
+    font-family: Pretendard;
     font-weight: 100;
     font-display: swap;
     src: url(${pretendardThinWoff2}) format('woff2');

diff --git a/frontend/src/common/reset.style.ts b/frontend/src/common/reset.style.ts
@@ -87,7 +87,7 @@ const reset = css`
     margin: 0;
     padding: 0;
 
-    font-family: Pretendard;
+    font-family: Pretendard, sans-serif;
     font-size: 62.5%;
     vertical-align: baseline;
 

diff --git a/frontend/src/components/MoimDescription/MoimDescription.style.ts b/frontend/src/components/MoimDescription/MoimDescription.style.ts
@@ -18,7 +18,11 @@ export const titleStyle = css`
 `;
 
 export const descriptionStyle = css`
-  font-size: 14px;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+
+  font-size: 20px;
   font-weight: 600;
   color: rgb(255 255 255 / 100%);
 `;
diff --git a/frontend/src/layouts/InformationLayout/InformationLayout.style.ts b/frontend/src/layouts/InformationLayout/InformationLayout.style.ts
@@ -4,4 +4,5 @@ export const layoutStyle = css`
   display: flex;
   flex-direction: column;
   gap: 10px;
+  margin-bottom: 100px;
 `;
diff --git a/frontend/src/pages/MoimDetailPage/MoimDetailPage.tsx b/frontend/src/pages/MoimDetailPage/MoimDetailPage.tsx
@@ -11,6 +11,7 @@ import MoimSummary from '@_components/MoimSummary/MoimSummary';
 import ROUTES from '@_constants/routes';
 import useJoinMoim from '@_hooks/mutaions/useJoinMoim';
 import useMoim from '@_hooks/queries/useMoim';
+import { css } from '@emotion/react';
 
 export default function MoimDetailPage() {
   const navigate = useNavigate();
@@ -42,7 +43,6 @@ export default function MoimDetailPage() {
       <InformationLayout.ContentContainer>
         <MoimSummary moimInfo={moim} />
         <MoimInformation moimInfo={moim} />
-
         {moim.description && (
           <MoimDescription title={'상세설명'}>
             {moim.description}
@@ -51,11 +51,19 @@ export default function MoimDetailPage() {
         {moim.participants && (
           <MoimDescription title="참여자">
             {moim.participants.map((nickName) => {
-              return <p key={nickName}>{nickName}</p>;
+              return (
+                <div
+                  key={nickName}
+                  css={css`
+                    font-size: 1.5rem;
+                  `}
+                >
+                  {nickName}
+                </div>
+              );
             })}
           </MoimDescription>
         )}
-
         <LabeledInput
           title="참가자 이름"
           required

diff --git a/frontend/src/pages/ParticipationCompletePage/ParticipationCompletePage.tsx b/frontend/src/pages/ParticipationCompletePage/ParticipationCompletePage.tsx
@@ -18,13 +18,12 @@ export default function ParticipationCompletePage() {
       </CompleteLayout.Header>
       <CompleteLayout.ContentContainer>
         <div>참여가 완료되었어요!</div>
+        <CompleteLayout.BottomButtonWrapper>
+          <Button shape={'bar'} disabled={false} onClick={() => navigate(-1)}>
+            확인하기
+          </Button>
+        </CompleteLayout.BottomButtonWrapper>
       </CompleteLayout.ContentContainer>
-
-      <CompleteLayout.BottomButtonWrapper>
-        <Button shape={'bar'} disabled={false} onClick={() => navigate(-1)}>
-          확인하기
-        </Button>
-      </CompleteLayout.BottomButtonWrapper>
     </CompleteLayout>
   );
 }