design: header 부분 ui 변경

sopt-makers · Nov 27, 2024 · e6533c2 · e6533c2
1 parent 00d6fe7
commit e6533c2
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 7 deletions.
diff --git a/src/components/org/OrgAdmin/RecruitSection/Header.tsx b/src/components/org/OrgAdmin/RecruitSection/Header.tsx
@@ -1,7 +1,14 @@
 import { useFormContext } from 'react-hook-form';
 
+import RequiredIcon from '../assets/RequiredIcon';
 import MyDropzone from '../MyDropzone';
-import { StDescription, StTitle, StTitleWrapper, StWrapper } from '../style';
+import {
+  StDescription,
+  StLabel,
+  StTitle,
+  StTitleWrapper,
+  StWrapper,
+} from '../style';
 import { StLabelWrapper } from './style';
 
 const Header = () => {
@@ -10,8 +17,11 @@ const Header = () => {
   return (
     <StWrapper>
       <StTitleWrapper>
-        <StTitle>헤더</StTitle>
-        <StLabelWrapper>이미지</StLabelWrapper>
+        <StTitle>지원하기탭 헤더</StTitle>
+        <StLabelWrapper>
+          <StLabel>이미지</StLabel>
+          <RequiredIcon />
+        </StLabelWrapper>
         <StDescription>
           이미지는 1920*580 크기로 올려주세요. ‘지원하기’탭 가장 상단에 보여지는
           이미지예요.

diff --git a/src/components/org/OrgAdmin/RecruitSection/style.ts b/src/components/org/OrgAdmin/RecruitSection/style.ts
@@ -1,9 +1,9 @@
 import styled from '@emotion/styled';
 
-import { StLabel } from '../style';
-
-export const StLabelWrapper = styled(StLabel)`
-  display: inline-block;
+export const StLabelWrapper = styled.div`
+  display: flex;
+  gap: 4px;
+  align-items: center;
   margin: 30px 0px 8px;
 `;