Showing
1 changed file
with
37 additions
and
4 deletions
1 | import React from 'react'; | 1 | import React from 'react'; |
2 | import styled from 'styled-components'; | 2 | import styled from 'styled-components'; |
3 | +import Button from '../components/common/Button'; | ||
4 | +import DropDownButton from '../components/common/DropdownButton'; | ||
5 | +import Input from '../components/common/Input'; | ||
3 | 6 | ||
4 | const Main = styled.div` | 7 | const Main = styled.div` |
5 | - width: 100%; | 8 | + display: flex; |
9 | + height: 100vh; | ||
10 | + align-items: center; | ||
11 | + justify-content: center; | ||
12 | +`; | ||
13 | + | ||
14 | +const SearchBlock = styled.div` | ||
15 | + display: flex; | ||
16 | +`; | ||
17 | + | ||
18 | +const LoginButtonBlock = styled.div` | ||
19 | + position: fixed; | ||
20 | + top: 20px; | ||
21 | + right: 20px; | ||
6 | `; | 22 | `; |
7 | 23 | ||
8 | const HomePage = () => { | 24 | const HomePage = () => { |
9 | return ( | 25 | return ( |
10 | - <> | 26 | + <Main> |
11 | - <Main>Home</Main> | 27 | + <div>logo</div> |
12 | - </> | 28 | + <SearchBlock> |
29 | + <DropDownButton | ||
30 | + fontsize="20px" | ||
31 | + height="50px" | ||
32 | + options={[ | ||
33 | + { id: 1, name: '전체' }, | ||
34 | + { id: 2, name: '개인' }, | ||
35 | + { id: 3, name: '부서' }, | ||
36 | + ]} | ||
37 | + /> | ||
38 | + <Input color="blue" size="14px" width="400px" display /> | ||
39 | + </SearchBlock> | ||
40 | + | ||
41 | + {/* Todo : 로그인 했을 경우 로그인 버튼 숨기기 */} | ||
42 | + <LoginButtonBlock> | ||
43 | + <Button>로그인</Button> | ||
44 | + </LoginButtonBlock> | ||
45 | + </Main> | ||
13 | ); | 46 | ); |
14 | }; | 47 | }; |
15 | 48 | ... | ... |
-
Please register or login to post a comment