sdy

update ChatPresenter

...@@ -107,28 +107,38 @@ const ChatScreenBox = styled.div` ...@@ -107,28 +107,38 @@ const ChatScreenBox = styled.div`
107 } 107 }
108 `; 108 `;
109 109
110 +const InputWrapper = styled.div`
111 + width: 100%;
112 + display: flex;
113 + flex-direction: row;
114 + justify-content: center;
115 + align-items: center;
116 +`;
117 +
110 const InputContainer = styled.div` 118 const InputContainer = styled.div`
111 position: fixed; 119 position: fixed;
112 bottom: 0; 120 bottom: 0;
113 justify-content: center; 121 justify-content: center;
114 align-items: center; 122 align-items: center;
115 - width: 70%; 123 + width: 50%;
116 - margin: 10px; 124 + margin-bottom: 20px;
117 display: flex; 125 display: flex;
118 flex-direction: row; 126 flex-direction: row;
127 + background-color: #b2bec3;
128 + border: none;
119 form { 129 form {
120 width: 100%; 130 width: 100%;
121 button { 131 button {
122 background-color: #27ae60; 132 background-color: #27ae60;
123 - width: 10%; 133 + width: 20%;
124 color: white; 134 color: white;
125 border-radius: 10px; 135 border-radius: 10px;
126 } 136 }
127 input { 137 input {
138 + background-color: #b2bec3;
128 width: 70%; 139 width: 70%;
129 } 140 }
130 } 141 }
131 - border: 1px solid rgba(0, 0, 0, 0.7);
132 border-radius: 10px; 142 border-radius: 10px;
133 `; 143 `;
134 144
...@@ -188,6 +198,7 @@ export default ({ ...@@ -188,6 +198,7 @@ export default ({
188 avatar={e.sender.avatarUrl} 198 avatar={e.sender.avatarUrl}
189 /> 199 />
190 ))} 200 ))}
201 + <InputWrapper>
191 <InputContainer className="InputContainer"> 202 <InputContainer className="InputContainer">
192 <form onSubmit={onSubmit}> 203 <form onSubmit={onSubmit}>
193 <Input 204 <Input
...@@ -198,6 +209,7 @@ export default ({ ...@@ -198,6 +209,7 @@ export default ({
198 <Button text={"Submit"} /> 209 <Button text={"Submit"} />
199 </form> 210 </form>
200 </InputContainer> 211 </InputContainer>
212 + </InputWrapper>
201 </ChatScreenBox> 213 </ChatScreenBox>
202 </ChatScreenContainer> 214 </ChatScreenContainer>
203 </ChatWrapper> 215 </ChatWrapper>
......