Enhaced search bar of merchants update
This commit is contained in:
parent
7474063918
commit
af048d2027
3 changed files with 20 additions and 11 deletions
|
@ -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
|
||||||
|
|
3
src/components/pages/MerchantsPage.css
Normal file
3
src/components/pages/MerchantsPage.css
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
.MuiFormLabel-root-82.MuiFormLabel-focused-83 {
|
||||||
|
color: #139657
|
||||||
|
}
|
|
@ -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();
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue