diff --git a/public/sass/_variables.dark.scss b/public/sass/_variables.dark.scss index c0d1757dae7..a2ccc01f071 100644 --- a/public/sass/_variables.dark.scss +++ b/public/sass/_variables.dark.scss @@ -21,7 +21,10 @@ $gray-4: #D8D9DA; $gray-5: #ECECEC; $gray-6: #f4f5f8; $gray-7: #fbfbfb; -$gray-blue: #292a2d; + +// $gray-blue: #292a2d; +$gray-blue: #212327; +$input-black: #09090B; $white: #fff; @@ -175,7 +178,7 @@ $btn-drag-image: '../img/grab_dark.svg'; // Forms // ------------------------- -$input-bg: $black; +$input-bg: $input-black; $input-bg-disabled: $dark-3; $input-color: $gray-4; @@ -185,7 +188,7 @@ $input-border-focus: $input-border-color !default; $input-box-shadow-focus: rgba(102,175,233,.6) !default; $input-color-placeholder: $gray-1 !default; $input-label-bg: $gray-blue; -$input-label-border-color: $gray-blue; +$input-label-border-color: $dark-3; $input-invalid-border-color: lighten($red, 5%); // Search diff --git a/public/sass/_variables.scss b/public/sass/_variables.scss index 9a1e42995b3..a0c52dee2ef 100644 --- a/public/sass/_variables.scss +++ b/public/sass/_variables.scss @@ -89,9 +89,9 @@ $font-size-root: 14px !default; $font-size-base: 13px !default; $font-size-lg: 18px !default; -$font-size-md: 15px !default; -$font-size-sm: 11px !default; -$font-size-xs: 9px !default; +$font-size-md: 14px !default; +$font-size-sm: 12px !default; +$font-size-xs: 10px !default; $line-height-base: 1.5 !default; $font-weight-semi-bold: 500; @@ -135,9 +135,9 @@ $list-inline-padding: 5px !default; $line-height-lg: (4 / 3) !default; $line-height-sm: 1.5 !default; -$border-radius: 0.2rem !default; -$border-radius-lg: 0.3rem !default; -$border-radius-sm: 0.1rem !default; +$border-radius: 3px !default; +$border-radius-lg: 5px !default; +$border-radius-sm: 2px!default; $caret-width: .3em !default; $caret-width-lg: $caret-width !default; @@ -162,7 +162,7 @@ $table-sm-cell-padding: .3rem !default; // Forms $input-padding-x: 10px !default; $input-padding-y: 8px !default; -$input-line-height: 19px !default; +$input-line-height: 18px !default; $input-btn-border-width: 1px; $input-border-radius: 0 $border-radius $border-radius 0 !default; @@ -203,9 +203,7 @@ $zindex-tooltip: 1030; $zindex-modal-backdrop: 1040; $zindex-modal: 1050; $zindex-typeahead: 1060; -$zindex-sidemenu : $zindex-navbar-fixed + 5; - - +$zindex-sidemenu: $zindex-navbar-fixed; // Buttons // diff --git a/public/sass/components/_gf-form.scss b/public/sass/components/_gf-form.scss index 16cb2873cbe..4701f0df5e8 100644 --- a/public/sass/components/_gf-form.scss +++ b/public/sass/components/_gf-form.scss @@ -8,7 +8,6 @@ $input-border: 1px solid $input-border-color; align-items: center; text-align: left; position: relative; - font-size: $font-size-sm; &--offset-1 { margin-left: $spacer; @@ -65,7 +64,6 @@ $input-border: 1px solid $input-border-color; .gf-form-label { padding: $input-padding-y $input-padding-x; - margin-right: $gf-form-margin; flex-shrink: 0; font-weight: $font-weight-semi-bold; @@ -74,8 +72,8 @@ $input-border: 1px solid $input-border-color; font-size: $font-size-sm; border: $input-btn-border-width solid $input-label-border-color; - @include border-radius($label-border-radius-sm); - + border-right: none; + border-radius: $label-border-radius; &--grow { flex-grow: 1; @@ -94,6 +92,7 @@ $input-border: 1px solid $input-border-color; margin: 0; margin-right: $gf-form-margin; border: $input-btn-border-width solid transparent; + border-left: none; @include border-radius($label-border-radius-sm); } @@ -119,14 +118,14 @@ $input-border: 1px solid $input-border-color; width: 100%; padding: $input-padding-y $input-padding-x; margin-right: $gf-form-margin; - font-size: $font-size-base; + font-size: $font-size-md; line-height: $input-line-height; color: $input-color; background-color: $input-bg; background-image: none; background-clip: padding-box; border: $input-border; - @include border-radius($input-border-radius-sm); + border-radius: $input-border-radius; @include box-shadow($input-box-shadow); white-space: nowrap; overflow: hidden; @@ -279,6 +278,7 @@ $input-border: 1px solid $input-border-color; background-color: $input-bg; padding-right: $input-padding-x; border: $input-border; + border-radius: $input-border-radius; &::after { position: absolute; diff --git a/public/sass/components/_switch.scss b/public/sass/components/_switch.scss index b612091d171..66cadd01369 100644 --- a/public/sass/components/_switch.scss +++ b/public/sass/components/_switch.scss @@ -1,7 +1,3 @@ -$switch-border-radius: 1rem; -$switch-width: 3.5rem; -$switch-height: 1.5rem; - /* ============================================================ SWITCH 3 - YES NO ============================================================ */ @@ -27,8 +23,10 @@ $switch-height: 1.5rem; outline: none; user-select: none; width: 100%; - height: 2.65rem; - background-color: $page-bg; + height: 37px; + background: $input-bg; + border: 1px solid $input-border-color; + border-left: none; } input + label::before, input + label::after { @@ -47,6 +45,7 @@ $switch-height: 1.5rem; display: flex; flex-direction: column; justify-content: center; + border-radius: $input-border-radius; } &:hover {