Update input field border on focus

feature/default_network_editable
Alexander Tseung 7 years ago
parent c4e75a7075
commit 8245bf010e
  1. 4
      ui/app/components/text-field/text-field.component.js

@ -31,6 +31,7 @@ const styles = {
}, },
}, },
formLabelFocused: {}, formLabelFocused: {},
inputFocused: {},
inputRoot: { inputRoot: {
'label + &': { 'label + &': {
marginTop: '8px', marginTop: '8px',
@ -41,7 +42,7 @@ const styles = {
padding: '0 16px', padding: '0 16px',
display: 'flex', display: 'flex',
alignItems: 'center', alignItems: 'center',
'&:focus': { '&$inputFocused': {
border: '1px solid #2f9ae0', border: '1px solid #2f9ae0',
}, },
}, },
@ -89,6 +90,7 @@ class TextField extends Component {
root: material ? '' : classes.inputRoot, root: material ? '' : classes.inputRoot,
input: material ? '' : classes.input, input: material ? '' : classes.input,
underline: material ? classes.materialUnderline : '', underline: material ? classes.materialUnderline : '',
focused: material ? '' : classes.inputFocused,
}, },
}} }}
{...textFieldProps} {...textFieldProps}

Loading…
Cancel
Save