이승윤

style: css position 변경

...@@ -32,34 +32,34 @@ const ModalContent = styled.div` ...@@ -32,34 +32,34 @@ const ModalContent = styled.div`
32 `; 32 `;
33 33
34 const SearchWrap = styled.div` 34 const SearchWrap = styled.div`
35 - position: fixed; 35 + position: absolute;
36 - top: 50%; 36 + top: 80%;
37 - right: 43%; 37 + left: 20%;
38 `; 38 `;
39 39
40 const CloseWrap = styled.div` 40 const CloseWrap = styled.div`
41 - position: fixed; 41 + position: absolute;
42 - top: 50%; 42 + top: 80%;
43 - right: 32%; 43 + right: 20%;
44 `; 44 `;
45 45
46 const StandardWrap = styled.div` 46 const StandardWrap = styled.div`
47 + position: absolute;
47 width: 50px; 48 width: 50px;
48 - position: fixed; 49 + top: 15px;
49 - top: 18%; 50 + left: 30%;
50 - right: 43%;
51 `; 51 `;
52 52
53 const AdvancedWrap = styled.div` 53 const AdvancedWrap = styled.div`
54 width: 50px; 54 width: 50px;
55 - position: fixed; 55 + position: absolute;
56 - top: 27%; 56 + top: 75px;
57 - right: 43%; 57 + left: 30%;
58 `; 58 `;
59 59
60 const TextWrap = styled.div` 60 const TextWrap = styled.div`
61 - position: fixed; 61 + position: absolute;
62 - width: 340px; 62 + width: 360px;
63 top: ${props => props.top}; 63 top: ${props => props.top};
64 right: ${props => props.right}; 64 right: ${props => props.right};
65 border-bottom: 2px solid #dee2e6; 65 border-bottom: 2px solid #dee2e6;
...@@ -81,21 +81,39 @@ const Modal = ({ showModal, setShowModal }) => { ...@@ -81,21 +81,39 @@ const Modal = ({ showModal, setShowModal }) => {
81 <Background onClick={closeModal}> 81 <Background onClick={closeModal}>
82 <ModalWrapper> 82 <ModalWrapper>
83 <ModalContent> 83 <ModalContent>
84 - <TextWrap top="18.5%" right="28.5%" bottom="19px"> 84 + <TextWrap top="15px" right="20px" bottom="19px">
85 기본검색 85 기본검색
86 </TextWrap> 86 </TextWrap>
87 <StandardWrap> 87 <StandardWrap>
88 <Input float="left" color="blue" width="140px" size="10px" /> 88 <Input float="left" color="blue" width="140px" size="10px" />
89 </StandardWrap> 89 </StandardWrap>
90 - <TextWrap top="27%" right="28.5%" bottom="137px"> 90 + <TextWrap top="75px" right="20px" bottom="137px">
91 고급검색 91 고급검색
92 </TextWrap> 92 </TextWrap>
93 <AdvancedWrap> 93 <AdvancedWrap>
94 - <Input float="left" color="blue" width="140px" size="10px" /> 94 + <Input
95 + float="left"
96 + color="blue"
97 + width="140px"
98 + size="10px"
99 + placeholder="단어/ 문장검색"
100 + />
95 <br /> <br /> 101 <br /> <br />
96 - <Input float="left" color="blue" width="140px" size="10px" /> 102 + <Input
103 + float="left"
104 + color="blue"
105 + width="140px"
106 + size="10px"
107 + placeholder="최초 작성자"
108 + />
97 <br /> <br /> 109 <br /> <br />
98 - <Input float="left" color="blue" width="140px" size="10px" /> 110 + <Input
111 + float="left"
112 + color="blue"
113 + width="140px"
114 + size="10px"
115 + placeholder="최종 수정자"
116 + />
99 </AdvancedWrap> 117 </AdvancedWrap>
100 </ModalContent> 118 </ModalContent>
101 <CloseWrap onClick={() => setShowModal(prev => !prev)}> 119 <CloseWrap onClick={() => setShowModal(prev => !prev)}>
......