Enhaced search bar of merchants update

This commit is contained in:
Letícia Camara 2018-10-04 12:36:17 -03:00
parent 7474063918
commit af048d2027
3 changed files with 20 additions and 11 deletions

View file

@ -30,8 +30,11 @@ const styles = theme => ({
}, },
textField: { textField: {
flexBasis: 280, flexBasis: 280,
borderColor: "#139657"
}, },
focused: {
color: '#139657',
backgroundColor: '#139657',
}
}); });
/** /**
@ -50,18 +53,19 @@ class EnhancedSearch extends Component {
<div className="search-books-bar"> <div className="search-books-bar">
<div className="search-books-input-wrapper" style={{ textAlign: 'left', marginLeft: 20}}> <div className="search-books-input-wrapper" style={{ textAlign: 'left', marginLeft: 20}}>
<TextField <TextField
style={{ textAlign: 'left', width: 350,borderColor: "#139657" }} style={{ textAlign: 'left', width: 350 }}
id="outlined-adornment-weight" id="outlined-adornment-weight"
className={classNames(classes.margin, classes.textField)} className={classNames(classes.margin, classes.textField)}
variant="outlined" classes={{ focused: classes.focused }}
label="Search" variant="outlined"
label="Search"
placeholder="Enter search term" placeholder="Enter search term"
value={query} value={query}
onChange={(event) => onUpdateQuery(event.target.value)} onChange={(event) => onUpdateQuery(event.target.value)}
InputProps={{ InputProps={{
startAdornment: <InputAdornment position="start"><Search /></InputAdornment>, startAdornment: <InputAdornment position="start"><Search /></InputAdornment>,
}} }}
/> />
<br /> <br />
{this.props.showSearchColumns && this.props.columns.map(column => ( {this.props.showSearchColumns && this.props.columns.map(column => (
<FormControlLabel <FormControlLabel
@ -80,7 +84,7 @@ class EnhancedSearch extends Component {
</div> </div>
</div> </div>
); );
}; }
} }
// Type checking the props of the component // Type checking the props of the component

View file

@ -0,0 +1,3 @@
.MuiFormLabel-root-82.MuiFormLabel-focused-83 {
color: #139657
}

View file

@ -19,6 +19,8 @@ import Countries from 'country-list';
import LoadingGif from '../../assets/img/loading_icon.gif'; import LoadingGif from '../../assets/img/loading_icon.gif';
import MerchantPin from '../../assets/img/map/merchant_pin.png'; import MerchantPin from '../../assets/img/map/merchant_pin.png';
import "./MerchantsPage.css";
// List of countries // List of countries
const countries = Countries(); const countries = Countries();