fix: login 페이지 레이아웃 수정

woowacourse-teams · Sep 26, 2024 · 3c57e95 · 3c57e95
1 parent 3b00b2a
commit 3c57e95
Showing 1 changed file with 16 additions and 5 deletions.
diff --git a/client/src/pages/EventPage/AdminPage/EventLoginPage.tsx b/client/src/pages/EventPage/AdminPage/EventLoginPage.tsx
@@ -5,17 +5,28 @@ import useEventLogin from '@hooks/useEventLogin';
 import {FixedButton, LabelInput} from '@HDesign/index';
 
 import RULE from '@constants/rule';
+import {css} from '@emotion/react';
 
 const EventLoginPage = () => {
   const {password, errorMessage, handleChange, canSubmit, submitPassword} = useEventLogin();
 
   return (
-    <>
+    <div
+      css={css`
+        display: flex;
+        flex-direction: column;
+        gap: 1rem;
+        padding: 1rem;
+      `}
+    >
       <Top>
-        <Top.Line text="행사 생성 시 설정한" />
-        <Top.Line text={`${RULE.maxEventPasswordLength}자리 숫자 비밀번호를 입력해 주세요.`} />
+        <Top.Line
+          text={`행사 생성 시 설정한 ${RULE.maxEventPasswordLength}자리`}
+          emphasize={[`${RULE.maxEventPasswordLength}자리`]}
+        />
+        <Top.Line text="숫자 비밀번호를 입력해 주세요." emphasize={['비밀번호']} />
       </Top>
-      <form onSubmit={submitPassword} style={{padding: '0 1rem'}}>
+      <form onSubmit={submitPassword}>
         <LabelInput
           labelText="비밀번호"
           errorText={errorMessage}
@@ -29,7 +40,7 @@ const EventLoginPage = () => {
         ></LabelInput>
         <FixedButton disabled={!canSubmit}>관리 페이지로</FixedButton>
       </form>
-    </>
+    </div>
   );
 };