mirror of
https://github.com/trezor/trezor-wallet
synced 2024-11-13 20:08:56 +00:00
Style Select
This commit is contained in:
parent
34e859bd77
commit
597a771882
@ -4,15 +4,11 @@ import Select from 'react-select';
|
||||
import AsyncSelect from 'react-select/lib/Async';
|
||||
import colors from 'config/colors';
|
||||
|
||||
const styles = {
|
||||
const styles = isSearchable => ({
|
||||
singleValue: base => ({
|
||||
...base,
|
||||
color: colors.TEXT_SECONDARY,
|
||||
}),
|
||||
container: base => ({
|
||||
...base,
|
||||
width: '180px',
|
||||
}),
|
||||
control: (base, { isDisabled }) => ({
|
||||
...base,
|
||||
borderRadius: '2px',
|
||||
@ -20,7 +16,7 @@ const styles = {
|
||||
boxShadow: 'none',
|
||||
background: isDisabled ? colors.LANDING : colors.WHITE,
|
||||
'&:hover': {
|
||||
cursor: 'pointer',
|
||||
cursor: isSearchable ? 'text' : 'pointer',
|
||||
borderColor: colors.DIVIDER,
|
||||
},
|
||||
}),
|
||||
@ -29,6 +25,7 @@ const styles = {
|
||||
}),
|
||||
dropdownIndicator: base => ({
|
||||
...base,
|
||||
display: isSearchable ? 'none' : 'block',
|
||||
color: colors.TEXT_SECONDARY,
|
||||
path: '',
|
||||
'&:hover': {
|
||||
@ -61,21 +58,23 @@ const styles = {
|
||||
background: colors.LANDING,
|
||||
},
|
||||
}),
|
||||
};
|
||||
});
|
||||
|
||||
const SelectWrapper = props => (
|
||||
<div>
|
||||
{props.isAsync && <AsyncSelect styles={styles} {...props} /> }
|
||||
{!props.isAsync && <Select styles={styles} {...props} />}
|
||||
{props.isAsync && <AsyncSelect styles={styles(props.isSearchable)} {...props} /> }
|
||||
{!props.isAsync && <Select styles={styles(props.isSearchable)} {...props} />}
|
||||
</div>
|
||||
);
|
||||
|
||||
SelectWrapper.propTypes = {
|
||||
isAsync: PropTypes.bool,
|
||||
isSearchable: PropTypes.bool,
|
||||
};
|
||||
|
||||
SelectWrapper.defaultProps = {
|
||||
isAsync: false,
|
||||
isSearchable: false,
|
||||
};
|
||||
|
||||
export default SelectWrapper;
|
||||
|
@ -64,6 +64,7 @@ const LearnMoreText = styled.span`
|
||||
|
||||
const SelectWrapper = styled(Select)`
|
||||
margin-right: 10px;
|
||||
width: 180px;
|
||||
`;
|
||||
|
||||
const DownloadBridgeWrapper = styled.div`
|
||||
|
Loading…
Reference in New Issue
Block a user