1
0
mirror of https://github.com/trezor/trezor-wallet synced 2024-12-28 09:58:23 +00:00

add box shadow

This commit is contained in:
slowbackspace 2019-01-18 15:55:20 +01:00
parent 8edb6b66b8
commit bdd43b49b2
5 changed files with 17 additions and 7 deletions

View File

@ -38,7 +38,8 @@ const Wrapper = styled.button`
}
&:focus {
border-color: ${colors.INPUT_BORDER_FOCUSED};
border-color: ${colors.INPUT_FOCUSED_BORDER};
box-shadow: 0 0px 6px 0 ${colors.INPUT_FOCUSED_SHADOW};
}
${props => props.isDisabled && css`
@ -53,7 +54,7 @@ const Wrapper = styled.button`
border: 1px solid ${colors.DIVIDER};
&:focus {
border-color: ${colors.INPUT_BORDER_FOCUSED};
border-color: ${colors.INPUT_FOCUSED_BORDER};
}
&:hover {
@ -72,6 +73,11 @@ const Wrapper = styled.button`
border: 0px;
color: ${colors.TEXT_SECONDARY};
&:focus {
color: ${colors.TEXT_PRIMARY};
box-shadow: none;
}
&:hover,
&:active {
color: ${colors.TEXT_PRIMARY};

View File

@ -16,8 +16,8 @@ const styles = isSearchable => ({
minHeight: 'initial',
height: '40px',
borderRadius: '2px',
borderColor: isFocused ? colors.INPUT_BORDER_FOCUSED : colors.DIVIDER,
boxShadow: 'none',
borderColor: isFocused ? colors.INPUT_FOCUSED_BORDER : colors.DIVIDER,
boxShadow: isFocused ? `0 0px 6px 0 ${colors.INPUT_FOCUSED_SHADOW}` : 'none',
background: isDisabled ? colors.LANDING : colors.WHITE,
'&:hover': {
cursor: isSearchable ? 'text' : 'pointer',

View File

@ -68,7 +68,8 @@ const StyledTextarea = styled(Textarea)`
}
&:focus {
border-color: ${colors.INPUT_BORDER_FOCUSED};
border-color: ${colors.INPUT_FOCUSED_BORDER};
box-shadow: 0 0px 6px 0 ${colors.INPUT_FOCUSED_SHADOW};
}
&:disabled {

View File

@ -60,7 +60,8 @@ const StyledInput = styled.input`
transition: ${TRANSITION.HOVER};
&:focus {
border-color: ${colors.INPUT_BORDER_FOCUSED};
border-color: ${colors.INPUT_FOCUSED_BORDER};
box-shadow: 0 0px 6px 0 ${colors.INPUT_FOCUSED_SHADOW};
}
&:disabled {

View File

@ -34,5 +34,7 @@ export default {
LABEL_COLOR: '#A9A9A9',
TOOLTIP_BACKGROUND: '#333333',
INPUT_BORDER_FOCUSED: '#A9A9A9',
INPUT_FOCUSED_BORDER: '#A9A9A9',
INPUT_FOCUSED_SHADOW: '#d6d7d7',
};