From ccc67c6d638453ac72f91e4ff757a833632a23eb Mon Sep 17 00:00:00 2001 From: Anna Tsyganova Date: Wed, 27 Jul 2022 17:39:48 +0300 Subject: SILABMC-191: Fix login fields --- src/assets/styles/bmc/_sila/_forms.scss | 39 +++++++++++++-------------- src/assets/styles/bmc/_sila/_modal.scss | 12 ++++----- src/assets/styles/bmc/_sila/pages/_login.scss | 15 +++++------ 3 files changed, 31 insertions(+), 35 deletions(-) (limited to 'src/assets/styles/bmc') diff --git a/src/assets/styles/bmc/_sila/_forms.scss b/src/assets/styles/bmc/_sila/_forms.scss index 82f7b710..5a5d61c6 100644 --- a/src/assets/styles/bmc/_sila/_forms.scss +++ b/src/assets/styles/bmc/_sila/_forms.scss @@ -4,7 +4,7 @@ line-height: $form-line-height; margin-top: -$spacer / 4; margin-bottom: $spacer / 2; - color: gray("700")!important; + color: gray("700") !important; } // Legend label @@ -45,7 +45,7 @@ } .custom-select { - background-image: url('~@/assets/images/_sila/chevron-down.svg'); + background-image: url("~@/assets/images/_sila/chevron-down.svg"); background-size: 18px; } @@ -54,7 +54,7 @@ -webkit-appearance: none; margin: 0; } -.form-control[type='number'] { +.form-control[type="number"] { -moz-appearance: textfield; } @@ -116,8 +116,10 @@ } .custom-checkbox .custom-control-input:checked ~ .custom-control-label::after, -.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before, -.custom-control-input:checked ~ .custom-control-label::before { +.custom-checkbox + .custom-control-input:indeterminate + ~ .custom-control-label::before, +.custom-control-input:checked ~ .custom-control-label::before { border: 1px solid $red !important; background-color: $red !important; box-shadow: 0px 0px 0px 3px $white inset; @@ -127,16 +129,16 @@ } } -.custom-radio .custom-control-input:checked ~ .custom-control-label::after{ +.custom-radio .custom-control-input:checked ~ .custom-control-label::after { background-image: none; } .custom-control { - .custom-control-input[disabled=disabled] { + .custom-control-input[disabled="disabled"] { & + .custom-control-label { // Disabled label for checkbox, radio, // switch bootstrap form components - color: gray("600")!important; + color: gray("600") !important; } } } @@ -146,13 +148,11 @@ height: 16px; } -.custom-switch -.custom-control-input:focus ~ .custom-control-label::before { +.custom-switch .custom-control-input:focus ~ .custom-control-label::before { box-shadow: none; } -.custom-switch -.custom-control-input ~ .custom-control-label::after { +.custom-switch .custom-control-input ~ .custom-control-label::after { border: 1px solid $gray-20; background: $white; } @@ -166,8 +166,7 @@ border-color: $gray-20; } -.custom-switch -.custom-control-input ~ .custom-control-label::before { +.custom-switch .custom-control-input ~ .custom-control-label::before { border: 1px solid $gray-20; background: rgba(4, 10, 15, 0.3); } @@ -192,10 +191,10 @@ } // Form validation icon - .form-control.is-invalid, - .form-control.is-valid { - background-position: right 1rem bottom 50%; - } +.form-control.is-invalid, +.form-control.is-valid { + background-position: right 1rem bottom 50%; +} // Form validation icon with datepicker or password toggle icon .form-control-with-button { @@ -208,7 +207,7 @@ .invisible { height: 0; margin-bottom: 0; -} +} // Global style progress bar .progress { height: 8px; @@ -241,4 +240,4 @@ display: flex; flex-direction: column; } -} \ No newline at end of file +} diff --git a/src/assets/styles/bmc/_sila/_modal.scss b/src/assets/styles/bmc/_sila/_modal.scss index 5f40d5e1..f0fc764f 100644 --- a/src/assets/styles/bmc/_sila/_modal.scss +++ b/src/assets/styles/bmc/_sila/_modal.scss @@ -18,7 +18,7 @@ &:hover { background-color: none; } - } + } .modal-title { font-size: 1.25rem !important; font-weight: 500; @@ -35,13 +35,12 @@ justify-content: flex-start; } -.file-input_container > -.custom-file { +.file-input_container > .custom-file { height: 100%; } - .custom-file-input ~ .custom-file-label { - background-color: transparent; +.custom-file-input ~ .custom-file-label { + background-color: transparent; border: 1px dashed $text-tretiatry; box-sizing: border-box; border-radius: $border-radius; @@ -53,7 +52,6 @@ justify-content: center; } - .custom-file-input ~ .custom-file-label::after { display: none; } @@ -74,4 +72,4 @@ width: 100%; } } -} +} diff --git a/src/assets/styles/bmc/_sila/pages/_login.scss b/src/assets/styles/bmc/_sila/pages/_login.scss index e3abde78..99c6d9ed 100644 --- a/src/assets/styles/bmc/_sila/pages/_login.scss +++ b/src/assets/styles/bmc/_sila/pages/_login.scss @@ -1,4 +1,3 @@ - // // Login Page: // @@ -15,20 +14,20 @@ margin-bottom: 1.5rem; display: flow-root; } - + .login-form > .form-group > div > input, -.login-form > .form-group > div > select, -.input-password-toggle-container > input { +.login-form > .form-group > div > select, +.login-form > .login-form__section .input-password-toggle-container > input { margin: -28px 0 0 0; padding-top: 28px; - height: 56px; + height: 56px; } -.login-form > .form-group > label, -.login-form__section > label { +.login-form > .form-group > label, +.login-form > .login-form__section > label { margin-left: 10px; margin-bottom: 0.25rem; - color: $text-tretiatry + color: $text-tretiatry; } .login-main > h1 { -- cgit v1.2.3