diff --git a/common/components/NonceField.scss b/common/components/NonceField.scss index 66ec479f..eb865d3a 100644 --- a/common/components/NonceField.scss +++ b/common/components/NonceField.scss @@ -34,7 +34,7 @@ &-refresh { position: absolute; right: 0; - bottom: 0rem; + bottom: 1rem; padding: 0.75rem 1rem; } } diff --git a/common/components/WalletDecrypt/components/DeterministicWalletsModal.scss b/common/components/WalletDecrypt/components/DeterministicWalletsModal.scss index 88816a5f..05873579 100644 --- a/common/components/WalletDecrypt/components/DeterministicWalletsModal.scss +++ b/common/components/WalletDecrypt/components/DeterministicWalletsModal.scss @@ -37,12 +37,6 @@ padding-right: $space; border: none; } - - .form-control { - display: inline-block; - width: auto; - margin: 0 0 0 10px; - } } &-addresses { diff --git a/common/components/ui/Input.scss b/common/components/ui/Input.scss index 92a83fa3..27c63028 100644 --- a/common/components/ui/Input.scss +++ b/common/components/ui/Input.scss @@ -85,13 +85,13 @@ border-color: $brand-danger; box-shadow: inset 0px 0px 0px 1px $brand-danger; } + &.valid.has-value { + border-color: #8dd17b; + box-shadow: inset 0px 0px 0px 1px #8dd17b; + } &:focus { border-color: #4295bc; box-shadow: inset 0px 0px 0px 1px #4295bc; - &.valid { - border-color: #8dd17b; - box-shadow: inset 0px 0px 0px 1px #8dd17b; - } } } } diff --git a/common/components/ui/Input.tsx b/common/components/ui/Input.tsx index 99021218..b72a3e07 100644 --- a/common/components/ui/Input.tsx +++ b/common/components/ui/Input.tsx @@ -28,10 +28,7 @@ class Input extends React.Component { const classname = classnames( this.props.className, 'input-group-input', - 'form-control', - this.state.isStateless - ? '' - : isValid ? (showValidAsPlain ? '' : `is-valid valid`) : `is-invalid invalid`, + this.state.isStateless ? '' : isValid ? (showValidAsPlain ? '' : '') : `invalid`, this.state.hasBlurred && 'has-blurred', hasValue && 'has-value' ); diff --git a/common/components/ui/OldDropdown.tsx b/common/components/ui/OldDropdown.tsx index 9e0259df..76860797 100644 --- a/common/components/ui/OldDropdown.tsx +++ b/common/components/ui/OldDropdown.tsx @@ -70,14 +70,7 @@ export default class DropdownComponent extends PureComponent, State> return (
    - {searchable && ( - - )} + {searchable && } {options .filter(option => { diff --git a/common/components/ui/SimpleSelect.tsx b/common/components/ui/SimpleSelect.tsx deleted file mode 100644 index 85205ce8..00000000 --- a/common/components/ui/SimpleSelect.tsx +++ /dev/null @@ -1,27 +0,0 @@ -import React, { PureComponent } from 'react'; - -interface Props { - value?: string; - options: string[]; - onChange(event: React.FormEvent): void; -} - -export default class SimpleSelect extends PureComponent { - public render() { - return ( - - ); - } -} diff --git a/common/components/ui/TextArea.tsx b/common/components/ui/TextArea.tsx index aa711526..bf969621 100644 --- a/common/components/ui/TextArea.tsx +++ b/common/components/ui/TextArea.tsx @@ -27,10 +27,7 @@ class TextArea extends React.Component { const classname = classnames( this.props.className, 'input-group-input', - 'form-control', - this.state.isStateless - ? '' - : isValid ? (showValidAsPlain ? '' : `is-valid valid`) : `is-invalid invalid`, + this.state.isStateless ? '' : isValid ? (showValidAsPlain ? '' : '') : `invalid`, this.state.hasBlurred && 'has-blurred' ); diff --git a/common/containers/Tabs/Swap/components/CurrencySwap.tsx b/common/containers/Tabs/Swap/components/CurrencySwap.tsx index 00323b26..92977976 100644 --- a/common/containers/Tabs/Swap/components/CurrencySwap.tsx +++ b/common/containers/Tabs/Swap/components/CurrencySwap.tsx @@ -316,7 +316,7 @@ export default class CurrencySwap extends PureComponent {
    {
    {translate('SWAP_RECEIVE_INPUT_LABEL')}
    ) : null} diff --git a/common/sass/mixins.scss b/common/sass/mixins.scss index 2e841ce8..1e1e770a 100644 --- a/common/sass/mixins.scss +++ b/common/sass/mixins.scss @@ -6,7 +6,6 @@ padding: 0; background: none; border: none; - z-index: 999; cursor: pointer; } diff --git a/common/sass/styles/overrides/forms.scss b/common/sass/styles/overrides/forms.scss index 991ebfd2..1a2b0209 100644 --- a/common/sass/styles/overrides/forms.scss +++ b/common/sass/styles/overrides/forms.scss @@ -12,12 +12,6 @@ label { } } -label + .form-control, -label + input, -label + textarea { - margin-top: 0; -} - input[type='radio'], input[type='checkbox'] { margin: 3px 0 0; @@ -29,24 +23,6 @@ input[readonly] { cursor: text !important; } -.form-control { - margin-bottom: $space-sm; - transition: $transition; - padding: $input-padding; - @include mono; - - &:focus { - border-color: $input-border-focus; - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 1px rgba($brand-primary, 0.5); - } -} - -input.form-control, -select.form-control { - padding-top: 0; - padding-bottom: 0; -} - .form-group { display: block; margin-bottom: $form-group-margin-bottom; @@ -58,31 +34,6 @@ select.form-control { font-weight: 500; } -// Custom feedback classes -@mixin form-control-state($color) { - border-color: lighten($color, 20%); - @include input-shadow($color); - - &:focus { - border-color: lighten($color, 5%); - @include input-focus-shadow($color); - } -} - -.form-control { - &.is-valid { - @include form-control-state($brand-success); - } - - &.is-invalid { - @include form-control-state($brand-danger); - } - - &.is-semivalid { - @include form-control-state($brand-warning); - } -} - .help-block { &.is-valid { color: $brand-success;