| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109 |
- //@mixin button-variant(
- // $background,
- // $border,
- // $color: color-contrast($background),
- // $hover-background: if($color == $color-contrast-light, shade-color($background, $btn-hover-bg-shade-amount), tint-color($background, $btn-hover-bg-tint-amount)),
- // $hover-border: if($color == $color-contrast-light, shade-color($border, $btn-hover-border-shade-amount), tint-color($border, $btn-hover-border-tint-amount)),
- // $hover-color: color-contrast($hover-background),
- // $active-background: if($color == $color-contrast-light, shade-color($background, $btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)),
- // $active-border: if($color == $color-contrast-light, shade-color($border, $btn-active-border-shade-amount), tint-color($border, $btn-active-border-tint-amount)),
- // $active-color: color-contrast($active-background),
- // $disabled-background: $background,
- // $disabled-border: $border,
- // $disabled-color: color-contrast($disabled-background)
- //) {
- // --#{$prefix}btn-color: #{$color};
- // --#{$prefix}btn-bg: #{$background};
- // --#{$prefix}btn-border-color: #{$border};
- // --#{$prefix}btn-hover-color: #{$hover-color};
- // --#{$prefix}btn-hover-bg: #{$hover-background};
- // --#{$prefix}btn-hover-border-color: #{$hover-border};
- // --#{$prefix}btn-focus-shadow-rgb: #{to-rgb(mix($color, $border, 15%))};
- // --#{$prefix}btn-active-color: #{$active-color};
- // --#{$prefix}btn-active-bg: #{$active-background};
- // --#{$prefix}btn-active-border-color: #{$active-border};
- // --#{$prefix}btn-active-shadow: #{$btn-active-box-shadow};
- // --#{$prefix}btn-disabled-color: #{$disabled-color};
- // --#{$prefix}btn-disabled-bg: #{$disabled-background};
- // --#{$prefix}btn-disabled-border-color: #{$disabled-border};
- //}
- @mixin iconed-button-variant(
- $simple: false,
- $background,
- $border,
- $color: color-contrast($background),
- $icon-color: $color,
- $icon-bg: shade-color($background, $btn-hover-bg-shade-amount),
- $hover-background: if($color == $color-contrast-light, shade-color($background, $btn-hover-bg-shade-amount), tint-color($background, $btn-hover-bg-tint-amount)),
- $hover-border: if($color == $color-contrast-light, shade-color($border, $btn-hover-border-shade-amount), tint-color($border, $btn-hover-border-tint-amount)),
- $hover-color: color-contrast($hover-background),
- $icon-hover-bg: $hover-background,
- $active-background: if($color == $color-contrast-light, shade-color($background, $btn-active-bg-shade-amount), tint-color($background, $btn-active-bg-tint-amount)),
- $active-border: if($color == $color-contrast-light, shade-color($border, $btn-active-border-shade-amount), tint-color($border, $btn-active-border-tint-amount)),
- $active-color: color-contrast($active-background),
- $disabled-background: $background,
- $disabled-border: $border,
- $disabled-color: color-contrast($disabled-background),
- ) {
- --#{$prefix}btn-color: #{$color};
- --#{$prefix}btn-bg: #{$background};
- --#{$prefix}btn-border-color: #{$border};
- --#{$prefix}btn-hover-color: #{$hover-color};
- --#{$prefix}btn-hover-bg: #{$hover-background};
- --#{$prefix}btn-hover-border-color: #{$hover-border};
- --#{$prefix}btn-focus-shadow-rgb: #{to-rgb(mix($color, $border, 15%))};
- --#{$prefix}btn-active-color: #{$active-color};
- --#{$prefix}btn-active-bg: #{$active-background};
- --#{$prefix}btn-active-border-color: #{$active-border};
- --#{$prefix}btn-active-shadow: #{$btn-active-box-shadow};
- --#{$prefix}btn-disabled-color: #{$disabled-color};
- --#{$prefix}btn-disabled-bg: #{$disabled-background};
- --#{$prefix}btn-disabled-border-color: #{$disabled-border};
- --#{$prefix}btn-icon-color: #{$icon-color};
- --#{$prefix}btn-icon-hover-color: #{$hover-color};
- @if ($simple == false) {
- --#{$prefix}btn-icon-bg: #{$icon-bg};
- --#{$prefix}btn-icon-hover-bg: #{$icon-hover-bg};
- }
- --activetes: #{$active-background};
- }
- //@mixin iconed-button-variant($color, $background, $border, $hoverColor: null, $simple: false, $iconColor: null, $active-background: null) {
- //
- // //border raus
- // $active-background: if($active-background, $active-background, darken($background, 9%));
- // $active-border: darken($border, 12%);
- // $hoverColor: if($hoverColor, $hoverColor, $color);
- //
- // color: $color;
- // background-color: $background;
- //
- // //@include box-shadow($btn-box-shadow);
- //
- // //@include hover-focus {
- // // color: $hoverColor;
- // // background-color: $active-background;
- // // border-color: $active-border;
- // //}
- //
- // //&.active {
- // // color: $hoverColor;
- // // background-color: $active-background;
- // // border-color: $active-border;
- // //}
- //
- // & > .btn-icon {
- // @include transition($btn-transition);
- // @if ($iconColor) {
- // color: $iconColor;
- // }
- // @if ($simple == false) {
- // background: $active-background;
- // }
- // }
- //}
|