diff --git a/src/components/FilterName/index.js b/src/components/FilterName/index.js index 36f0464..ad0da2c 100644 --- a/src/components/FilterName/index.js +++ b/src/components/FilterName/index.js @@ -4,6 +4,7 @@ import { connect } from 'react-redux'; import { bindActionCreators } from 'redux'; import * as actions from '../../actions/index'; import { ButtonInline } from '../../components/ButtonInline'; +import { InputMenu } from '../../components/InputMenu'; function FilterName({ filterNameQuery, @@ -24,7 +25,11 @@ function FilterName({
- onNameFilter(event.target.value.toLowerCase())} value={filterNameQuery} /> + onNameFilter(event.target.value.toLowerCase())} + value={filterNameQuery} + />
); diff --git a/src/components/InputMenu/index.js b/src/components/InputMenu/index.js new file mode 100644 index 0000000..704a081 --- /dev/null +++ b/src/components/InputMenu/index.js @@ -0,0 +1,17 @@ +import React from 'react'; + +function InputMenu({ value, onChange, placeholder }) { + return ( + + ); +} + +export { + InputMenu +}; diff --git a/styles/components/inputMenu.scss b/styles/components/inputMenu.scss new file mode 100644 index 0000000..a029a92 --- /dev/null +++ b/styles/components/inputMenu.scss @@ -0,0 +1,10 @@ +.input-menu { + font-size: $menuSize; + color: $fontColor; + border: 0; + background-color: $backgroundSecondary; + + &:focus { + outline: none; + } +} diff --git a/styles/index.scss b/styles/index.scss index ddb18fc..bb43300 100644 --- a/styles/index.scss +++ b/styles/index.scss @@ -20,3 +20,4 @@ @import 'components/buttonGhost'; @import 'components/buttonActive'; @import 'components/streamInteractions'; +@import 'components/inputMenu';