ceph/src/pybind/mgr/dashboard/frontend/src/app/core/auth/login-password-form/login-password-form.component.scss

   1 @use 'sass:map';
   2 @use './src/styles/vendor/variables' as vv;
   3
   4 $dark-secondary: darken(vv.$secondary, 4%);
   5
   6 ::ng-deep cd-login-password-form {
   7   h4 {
   8     margin: 0 0 30px;
   9   }
  10
  11   .form-group {
  12     background-color: $dark-secondary;
  13     border-left: 4px solid vv.$white;
  14
  15     &:focus-within {
  16       border-left: 4px solid map.get(vv.$theme-colors, 'accent');
  17     }
  18   }
  19
  20   .btn-password,
  21   .btn-password:focus,
  22   .form-control,
  23   .form-control:focus {
  24     background-color: $dark-secondary;
  25     border: 0;
  26     box-shadow: none;
  27     color: vv.$body-color-bright;
  28     filter: none;
  29     outline: none;
  30   }
  31
  32   .form-control::placeholder {
  33     color: vv.$gray-600;
  34   }
  35
  36   .btn-password:focus {
  37     outline-color: vv.$primary;
  38   }
  39
  40   button.btn:not(:first-child) {
  41     margin-left: 5px;
  42   }
  43 }
  44
  45 // This will override the colors applied by chrome
  46 @keyframes autofill {
  47   to {
  48     background-color: $dark-secondary;
  49     color: vv.$body-color-bright;
  50   }
  51 }
  52
  53 input:-webkit-autofill {
  54   animation-fill-mode: both;
  55   animation-name: autofill;
  56   border-radius: 0;
  57   box-shadow: 0 0 0 1000px $dark-secondary inset;
  58   -webkit-text-fill-color: vv.$body-color-bright;
  59   transition-property: none;
  60 }
  61
  62 .invalid-feedback {
  63   padding-left: 9px;
  64 }
  65
  66 .is-invalid.cd-form-control {
  67   border-color: transparent;
  68 }