[Summary view] [Print] [Text view]

   1  // Custom Forms
   2  
   3  .custom-select {
   4    @extend .form-select;
   5  }
   6  
   7  .form-select {
   8    max-width: $input-max-width;
   9    cursor: pointer;
  10    background: $form-select-background;
  11    background-color: $form-select-bg;
  12    border: $input-border;
  13  
  14    [dir=rtl] & {
  15      padding: $form-select-padding-y $form-select-padding-x $form-select-padding-y ($form-select-padding-x + $form-select-indicator-padding);
  16      background: $form-select-background-rtl;
  17      background-color: $form-select-bg;
  18    }
  19  
  20    &[multiple] {
  21      padding: 0;
  22      background-color: var(--white-offset);
  23  
  24      option {
  25        padding: $form-select-multiple-padding-y $form-select-padding-x;
  26        background-color: var(--white-offset);
  27  
  28        &:checked {
  29          color: var(--template-text-light);
  30          background-color: var(--template-bg-dark) !important;
  31        }
  32      }
  33    }
  34  
  35    &.form-select-success,
  36    &.custom-select-success {
  37      color: var(--success);
  38      background-color: var(--success);
  39      border-color: var(--success);
  40  
  41      option {
  42        color: $form-select-color;
  43        background-color: var(--white-offset);
  44      }
  45    }
  46  
  47    &.form-select-danger,
  48    &.custom-select-danger {
  49      color: var(--danger);
  50      background-color: var(--danger);
  51      border-color: var(--danger);
  52  
  53      option {
  54        color: $form-select-color;
  55        background-color: var(--white-offset);
  56      }
  57    }
  58  
  59    &:focus {
  60      border-color: $focuscolor;
  61      box-shadow: $focusshadow;
  62    }
  63  
  64    &:disabled {
  65      cursor: default;
  66      background: $gray-200;
  67      border: 0;
  68      box-shadow: none;
  69    }
  70  
  71    optgroup,
  72    option {
  73      color: var(--template-text-dark);
  74      background-color: $white;
  75    }
  76  }