Use 1px borders on inputs and buttons (#9766)

feature/default_network_editable
David Walsh 4 years ago committed by GitHub
parent 77dc0ab008
commit a74aa45bdd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 8
      ui/app/components/app/gas-customization/gas-price-button-group/index.scss
  2. 4
      ui/app/components/app/home-notification/index.scss
  3. 12
      ui/app/components/ui/button/buttons.scss
  4. 2
      ui/app/components/ui/text-field/text-field.component.js
  5. 2
      ui/app/css/itcss/components/network.scss
  6. 4
      ui/app/css/itcss/components/send.scss
  7. 6
      ui/app/pages/add-token/token-list/index.scss
  8. 4
      ui/app/pages/create-account/connect-hardware/index.scss
  9. 4
      ui/app/pages/settings/contact-list-tab/index.scss
  10. 2
      ui/app/pages/swaps/searchable-item-list/index.scss
  11. 2
      ui/app/pages/swaps/select-quote-popover/index.scss

@ -34,7 +34,7 @@
display: flex; display: flex;
padding-top: 17px; padding-top: 17px;
border-radius: 4px; border-radius: 4px;
border: 2px solid $spindle; border-color: $spindle;
background: $white; background: $white;
color: $scorpion; color: $scorpion;
@ -52,7 +52,7 @@
} }
.button-group__button--active { .button-group__button--active {
border: 2px solid $primary-blue; border-color: $primary-blue;
color: $scorpion; color: $scorpion;
i { i {
@ -222,10 +222,10 @@
.button-group__button--active { .button-group__button--active {
background: #f7fcff; background: #f7fcff;
border: 2px solid #2c8bdc; border-color: #2c8bdc;
&:first-child { &:first-child {
border: 2px solid #2c8bdc; border-color: #2c8bdc;
} }
.button-check-wrapper { .button-check-wrapper {

@ -51,7 +51,7 @@
} }
& &__ignore-button { & &__ignore-button {
border: 2px solid #6a737d; border-color: #6a737d;
box-sizing: border-box; box-sizing: border-box;
border-radius: 6px; border-radius: 6px;
color: $white; color: $white;
@ -75,7 +75,7 @@
} }
& &__accept-button { & &__accept-button {
border: 2px solid #6a737d; border-color: #6a737d;
box-sizing: border-box; box-sizing: border-box;
border-radius: 6px; border-radius: 6px;
color: $white; color: $white;

@ -39,7 +39,7 @@ $warning-light-orange: #f8b588;
.btn-secondary { .btn-secondary {
color: $Blue-500; color: $Blue-500;
border: 2px solid $hover-secondary; border: 1px solid $hover-secondary;
background-color: $white; background-color: $white;
&:hover { &:hover {
@ -60,7 +60,7 @@ $warning-light-orange: #f8b588;
.btn-warning { .btn-warning {
color: $Orange-500; color: $Orange-500;
border: 2px solid $hover-orange; border: 1px solid $hover-orange;
background-color: $white; background-color: $white;
&:hover { &:hover {
@ -81,7 +81,7 @@ $warning-light-orange: #f8b588;
.btn-danger { .btn-danger {
color: $Red-500; color: $Red-500;
border: 2px solid $hover-red; border: 1px solid $hover-red;
background-color: $white; background-color: $white;
&:hover { &:hover {
@ -102,7 +102,7 @@ $warning-light-orange: #f8b588;
.btn-danger-primary { .btn-danger-primary {
color: $white; color: $white;
border: 2px solid $Red-500; border: 1px solid $Red-500;
background-color: $Red-500; background-color: $Red-500;
&:hover { &:hover {
@ -125,7 +125,7 @@ $warning-light-orange: #f8b588;
.btn-default { .btn-default {
color: $Grey-500; color: $Grey-500;
border: 2px solid $hover-default; border: 1px solid $hover-default;
&:hover { &:hover {
border-color: $Grey-500; border-color: $Grey-500;
@ -145,7 +145,7 @@ $warning-light-orange: #f8b588;
.btn-primary { .btn-primary {
color: $white; color: $white;
border: 2px solid $Blue-500; border: 1px solid $Blue-500;
background-color: $Blue-500; background-color: $Blue-500;
&:hover { &:hover {

@ -61,7 +61,7 @@ const styles = {
'label + &': { 'label + &': {
marginTop: '9px', marginTop: '9px',
}, },
border: '2px solid #BBC0C5', border: '1px solid #BBC0C5',
height: '48px', height: '48px',
borderRadius: '6px', borderRadius: '6px',
padding: '0 16px', padding: '0 16px',

@ -7,7 +7,7 @@
} }
.network-component.pointer { .network-component.pointer {
border: 2px solid $Grey-200; border: 1px solid $Grey-200;
border-radius: 82px; border-radius: 82px;
padding: 6px 3px; padding: 6px 3px;
flex: 0 0 auto; flex: 0 0 auto;

@ -784,7 +784,7 @@
width: 56px; width: 56px;
height: 20px; height: 20px;
position: absolute; position: absolute;
border: 2px solid #b0d7f2; border: 1px solid #b0d7f2;
border-radius: 6px; border-radius: 6px;
cursor: pointer; cursor: pointer;
top: 0; top: 0;
@ -804,7 +804,7 @@
input:checked + &__button { input:checked + &__button {
background-color: $primary-blue; background-color: $primary-blue;
border: 2px solid $primary-blue; border: 1px solid $primary-blue;
color: #fff; color: #fff;
} }
} }

@ -20,15 +20,15 @@
box-sizing: border-box; box-sizing: border-box;
border-radius: 10px; border-radius: 10px;
cursor: pointer; cursor: pointer;
border: 2px solid transparent; border: 1px solid transparent;
position: relative; position: relative;
&:hover { &:hover {
border: 2px solid rgba($malibu-blue, 0.5); border-color: rgba($malibu-blue, 0.5);
} }
&--selected { &--selected {
border: 2px solid $malibu-blue !important; border-color: $malibu-blue !important;
} }
&--disabled { &--disabled {

@ -45,7 +45,7 @@
&__btn { &__btn {
background: #fbfbfb; background: #fbfbfb;
border: 2px solid #e5e5e5; border: 1px solid #e5e5e5;
height: 100px; height: 100px;
width: 150px; width: 150px;
flex: 1; flex: 1;
@ -61,7 +61,7 @@
} }
&__btn.selected { &__btn.selected {
border: 2px solid #00a8ee; border-color: #00a8ee;
width: 149px; width: 149px;
} }

@ -54,7 +54,7 @@
&__input { &__input {
@include H4; @include H4;
border: 2px solid $Grey-200; border: 1px solid $Grey-200;
border-radius: 6px; border-radius: 6px;
color: $Grey-800; color: $Grey-800;
padding: 0.875rem 1rem; padding: 0.875rem 1rem;
@ -230,7 +230,7 @@
justify-content: center; justify-content: center;
align-items: center; align-items: center;
border-radius: 50%; border-radius: 50%;
border-width: 2px; border-width: 1px;
background: $primary-blue; background: $primary-blue;
margin-right: 5px; margin-right: 5px;
cursor: pointer; cursor: pointer;

@ -72,7 +72,7 @@
} }
&--selected { &--selected {
border: 2px solid $malibu-blue !important; border: 1px solid $malibu-blue !important;
} }
&--disabled { &--disabled {

@ -83,7 +83,7 @@
border: none; border: none;
&:hover { &:hover {
border: 2px solid $Blue-500; border: 1px solid $Blue-500;
width: 101%; width: 101%;
padding-right: 11px; padding-right: 11px;
padding-left: 19.5px; padding-left: 19.5px;

Loading…
Cancel
Save