mfbs

CSS microframework
git clone https://git.ce9e.org/mfbs.git

commit
f84ade68a67e02faf0b8a3f3aa36914ea97678eb
parent
ff22a528aedd0bf5a1bfd495a7e8adba2fc49290
Author
Tobias Bengfort <tobias.bengfort@posteo.de>
Date
2024-04-04 20:56
inline parts of the button-color mixin

Diffstat

M sass/form.scss 40 +++++++++++++++++-----------------------

1 files changed, 17 insertions, 23 deletions


diff --git a/sass/form.scss b/sass/form.scss

@@ -33,28 +33,10 @@ textarea {
   33    33     line-height: inherit;
   34    34 }
   35    35 
   36    -1 @mixin button-color($color, $color-contrast, $color-focus) {
   37    -1     border-color: $color;
   38    -1     background: $color;
   39    -1     color: $color-contrast;
   40    -1 
   41    -1     &:hover, &:focus-visible {
   42    -1         border-color: mix($color, $color-focus, 50%);
   43    -1         background: mix($color, $color-focus, 50%);
   44    -1         color: $color-contrast;
   45    -1     }
   46    -1     &:active {
   47    -1         border-color: $color-focus;
   48    -1         background: $color-focus;
   49    -1         color: $color-contrast;
   50    -1     }
   51    -1     &:disabled {
   52    -1         border-color: $color;
   53    -1         background: $color;
   54    -1         color: $color-contrast;
   55    -1         opacity: 0.6;
   56    -1         cursor: not-allowed;
   57    -1     }
   -1    36 @mixin color-link($amount) {
   -1    37     border-color: mix($color-link, $color-link-focus, $amount);
   -1    38     background: mix($color-link, $color-link-focus, $amount);
   -1    39     color: $color-bg;
   58    40 }
   59    41 
   60    42 .button,
@@ -68,7 +50,19 @@ button,
   68    50     text-align: center;
   69    51     border-radius: 0.3em;
   70    52 
   71    -1     @include button-color($color-link, $color-bg, $color-link-focus);
   -1    53     @inline color-link(0%);
   -1    54 
   -1    55     &:hover, &:focus-visible {
   -1    56         @inline color-link(50%);
   -1    57     }
   -1    58     &:active {
   -1    59         @inline color-link(100%);
   -1    60     }
   -1    61     &:disabled {
   -1    62         @inline color-link(0%);
   -1    63         opacity: 0.6;
   -1    64         cursor: not-allowed;
   -1    65     }
   72    66 }
   73    67 
   74    68 input[type="file"]::file-selector-button {