HomePage.js
1.67 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
import React from 'react';
import styled from 'styled-components';
import { Link } from 'react-router-dom';
import Button from '../components/common/Button';
import DropDownButton from '../components/common/DropdownButton';
import Input from '../components/common/Input';
const Main = styled.div`
display: flex;
align-items: center;
justify-content: center;
`;
const Container = styled.div`
justify-content: center;
align-items: center;
flex-direction: column;
`;
const LogoWrap = styled.div`
display: flex;
margin-top: 11%;
height: 30vh;
align-items: center;
justify-content: center;
`;
const SearchBlock = styled.div`
display: flex;
width: 50%;
`;
const LoginButtonBlock = styled.div`
position: fixed;
top: 20px;
right: 20px;
`;
const SLink = styled(Link)`
text-decoration: none !important;
`;
const HomePage = () => {
return (
<Container>
<LogoWrap>
<img src="eDrive_logo.png" alt="" />
</LogoWrap>
<Main>
<SearchBlock>
<DropDownButton
fontsize="20px"
height="50px"
options={[
{ id: 0, name: '전체' },
{ id: 1, name: '작성자' },
{ id: 2, name: '내용' },
]}
/>
<Input color="blue" paddingsize="10px" width="100%" display />
</SearchBlock>
{/* Todo : 로그인 했을 경우 로그인 버튼 숨기기 */}
<LoginButtonBlock>
<SLink to="/login">
<Button>로그인</Button>
</SLink>
</LoginButtonBlock>
</Main>
</Container>
);
};
export default HomePage;