diff options
author | Eugene Sokolov <eug-vs@keemail.me> | 2020-06-14 20:44:40 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2020-06-14 20:44:40 +0300 |
commit | 65e41d1d8a3844a6d7268340f5d88b5957e2355d (patch) | |
tree | 3d455f133b5afa1e6a1c30c4589ef3db39dd4c4e /src/components/Header/SearchBar.tsx | |
parent | 99b44bc80fa3228131a05fccb13f75ff8a46b116 (diff) | |
parent | fbe489c83e9ef4c03b87624a4dec66de61af364a (diff) | |
download | which-ui-65e41d1d8a3844a6d7268340f5d88b5957e2355d.tar.gz |
Merge pull request #33 from ilyayudovin/pages
divide src into Pages and Components directories
Diffstat (limited to 'src/components/Header/SearchBar.tsx')
-rw-r--r-- | src/components/Header/SearchBar.tsx | 31 |
1 files changed, 31 insertions, 0 deletions
diff --git a/src/components/Header/SearchBar.tsx b/src/components/Header/SearchBar.tsx new file mode 100644 index 0000000..182a1a4 --- /dev/null +++ b/src/components/Header/SearchBar.tsx @@ -0,0 +1,31 @@ +import React from 'react'; +import SearchIcon from '@material-ui/icons/Search'; +import { InputBase } from '@material-ui/core'; +import { makeStyles } from '@material-ui/core/styles'; + +const useStyles = makeStyles(theme => ({ + root: { + background: 'rgba(255, 255, 255, 0.5)', + borderRadius: '2px', + padding: theme.spacing(0.5), + display: 'flex', + alignItems: 'center' + } +})); + +const SearchBar: React.FC = () => { + const classes = useStyles(); + + return ( + <div className={classes.root}> + <SearchIcon /> + <InputBase + placeholder="Search..." + /> + </div> + ); +}; + + +export default SearchBar; + |