Merge 72f9bd1 into 71621a2

client/src/container/main/TodoStatus.tsx

@@ -5,7 +5,7 @@ import Image from '@components/Image';
 import { isOnProgress, asyncActiveTodo } from '@util/GlobalState';
 import { useAtom } from 'jotai';
 
-import Working from '@images/Working.svg';
+import Working from '@images/Working';
 import Relaxing from '@images/Relaxing';
 
 import styled from 'styled-components';
@@ -14,6 +14,7 @@ import { todoStatusText } from '@util/Common';
 
 const Wrapper = styled.div`
   width: 850px;
+  height: 280px;
   padding: 0 6px;
   display: flex;
   flex-direction: row;
@@ -47,7 +48,7 @@ const TodoStatus = (): ReactElement => {
           fontSize={'18px'}
           fontWeight={'700'}
         />
-        {userState === 'working' ? <Image src={Working} transform={transform} /> : <Relaxing transform={transform} />}
+        {userState === 'working' ? <Working transform={transform} /> : <Relaxing transform={transform} />}
         <BlankBox />
       </Wrapper>
       <Hr />

client/src/container/todos/TodosHeader.tsx

@@ -1,8 +1,7 @@
 import { ReactElement, memo } from 'react';
-import Waiting from '@images/Waiting.svg';
-import Image from '@components/Image';
 import Text from '@components/Text';
 import styled from 'styled-components';
+import Waiting from '@images/Waiting';
 
 const Wrapper = styled.div`
   width: 100%;
@@ -13,7 +12,7 @@ const TodosHeader = (): ReactElement => {
   return (
     <Wrapper>
       <Text textAlign={'left'} margin={'0 25px'} text="할일 전체보기" />
-      <Image src={Waiting} />
+      <Waiting />
     </Wrapper>
   );
 };