add Filter styled

konstantin-it-lysenko · Nov 14, 2023 · a25b7b3 · a25b7b3
1 parent e0dd133
commit a25b7b3
Showing 1 changed file with 26 additions and 0 deletions.
diff --git a/src/components/Filter/Filter.styled.jsx b/src/components/Filter/Filter.styled.jsx
@@ -0,0 +1,26 @@
+import styled from '@emotion/styled';
+import TextField from '@mui/material/TextField';
+import SearchIcon from '@mui/icons-material/Search';
+
+export const Container = styled.div`
+  margin-bottom: 30px;
+  width: 300px;
+  display: flex;
+  align-items: center;
+  gap: 20px;
+  padding: 20px;
+  border: 2px solid #fff;
+  border-radius: 16px;
+  background-color: #302f2f;
+`;
+
+export const Input = styled(TextField)`
+  min-width: 200px;
+  width: 100%;
+`;
+
+export const Icon = styled(SearchIcon)`
+  fill: #fff;
+  width: 40px;
+  height: 40px;
+`;