sdy

remove icons, add Category container

...@@ -4,12 +4,9 @@ import Header from "../../Components/Header"; ...@@ -4,12 +4,9 @@ import Header from "../../Components/Header";
4 import Input from "../../Components/Input"; 4 import Input from "../../Components/Input";
5 import Button from "../../Components/Button"; 5 import Button from "../../Components/Button";
6 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; 6 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
7 -import { 7 +import { faAddressBook } from "@fortawesome/free-solid-svg-icons";
8 - faAddressBook,
9 - faArrowDown,
10 - faPlus,
11 -} from "@fortawesome/free-solid-svg-icons";
12 import { Link } from "react-router-dom"; 8 import { Link } from "react-router-dom";
9 +import Category from "../Category/CategoryContainer";
13 10
14 const Wrapper = styled.div` 11 const Wrapper = styled.div`
15 display: grid; 12 display: grid;
...@@ -72,34 +69,6 @@ const PeopleContainer = styled.div` ...@@ -72,34 +69,6 @@ const PeopleContainer = styled.div`
72 border-top: 1px solid rgba(255, 255, 255, 0.5); 69 border-top: 1px solid rgba(255, 255, 255, 0.5);
73 `; 70 `;
74 71
75 -const CategoryContainer = styled.div`
76 - display: flex;
77 - svg {
78 - font-size: 20px;
79 - }
80 - span {
81 - margin-left: 10px;
82 - font-size: 20px;
83 - }
84 - border-top: 1px solid rgba(255, 255, 255, 0.5);
85 -`;
86 -
87 -const ItemListContainer = styled.div`
88 - display: flex;
89 - flex-direction: row;
90 - width: 100%;
91 - padding: 15px;
92 -`;
93 -
94 -const ItemList = styled.ul`
95 - align-items: center;
96 - svg {
97 - margin: 0px 10px;
98 - }
99 -`;
100 -
101 -const Item = styled.li``;
102 -
103 const ChatScreenContainer = styled.div` 72 const ChatScreenContainer = styled.div`
104 display: grid; 73 display: grid;
105 width: 100%; 74 width: 100%;
...@@ -188,17 +157,7 @@ export default ({ data, location, message, onSubmit }) => { ...@@ -188,17 +157,7 @@ export default ({ data, location, message, onSubmit }) => {
188 <ItemText>People</ItemText> 157 <ItemText>People</ItemText>
189 </StyledLink> 158 </StyledLink>
190 </PeopleContainer> 159 </PeopleContainer>
191 - <CategoryContainer> 160 + <Category />
192 - <ItemListContainer>
193 - <ItemList>
194 - <FontAwesomeIcon icon={faArrowDown} /> Category
195 - <FontAwesomeIcon icon={faPlus} />
196 - <Item>
197 - <ItemText># Music</ItemText>
198 - </Item>
199 - </ItemList>
200 - </ItemListContainer>
201 - </CategoryContainer>
202 </ChatMenuContainer> 161 </ChatMenuContainer>
203 <ChatScreenContainer> 162 <ChatScreenContainer>
204 <ChatScreenHeader> 163 <ChatScreenHeader>
......