İlk temizlik tamamlandı bir önceki projeden
This commit is contained in:
@@ -0,0 +1,174 @@
|
||||
//
|
||||
// Buttons
|
||||
// --------------------------------------------------
|
||||
|
||||
@mixin button-variant($background, $border, $active-background: darken($background, 12%), $active-border: darken($border, 22%)) {
|
||||
$border-default: darken($border, 12%);
|
||||
|
||||
color: color-yiq($background);
|
||||
background-color: $background;
|
||||
border-color: $border-default;
|
||||
@include box-shadow($btn-box-shadow);
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.focus {
|
||||
color: color-yiq($background);
|
||||
background-color: $active-background;
|
||||
border-color: $active-border;
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&:disabled {
|
||||
background-color: $background;
|
||||
border-color: $border-default;
|
||||
}
|
||||
|
||||
&:not([disabled]):not(.disabled):active {
|
||||
background-color: $background;
|
||||
border-color: $border-default;
|
||||
}
|
||||
|
||||
&:not([disabled]):not(.disabled).active,
|
||||
.show > &.dropdown-toggle {
|
||||
background-color: $active-background;
|
||||
background-image: none; // Remove the gradient for the pressed/active state
|
||||
border-color: $active-border;
|
||||
}
|
||||
|
||||
&.btn-noborder {
|
||||
border-color: $background;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.focus {
|
||||
border-color: $active-background;
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&:disabled,
|
||||
&:not([disabled]):not(.disabled):active,
|
||||
&:not([disabled]):not(.disabled).active {
|
||||
border-color: $background;
|
||||
}
|
||||
|
||||
.show > &.dropdown-toggle {
|
||||
border-color: $active-background;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin button-outline-variant($color, $color-hover: #fff) {
|
||||
color: $color;
|
||||
background-color: transparent;
|
||||
background-image: none;
|
||||
border-color: $color;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.focus {
|
||||
color: $color-hover;
|
||||
background-color: $color;
|
||||
border-color: $color;
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&:disabled {
|
||||
color: $color;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
&:not([disabled]):not(.disabled):active {
|
||||
color: $color;
|
||||
background-color: transparent;
|
||||
border-color: $color;
|
||||
}
|
||||
|
||||
&:not([disabled]):not(.disabled).active,
|
||||
.show > &.dropdown-toggle {
|
||||
color: $color-hover;
|
||||
background-color: $color;
|
||||
border-color: $color;
|
||||
}
|
||||
|
||||
&.btn-noborder {
|
||||
border-color: transparent;
|
||||
|
||||
&:not([disabled]):not(.disabled):active,
|
||||
&:not([disabled]):not(.disabled).active {
|
||||
border-color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin button-alt-variant($color, $background) {
|
||||
$active-color: darken($color, 25%);
|
||||
$active-background: darken($background, 10%);
|
||||
|
||||
color: $active-color;
|
||||
background-color: $background;
|
||||
border-color: $background;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.focus {
|
||||
color: $active-color;
|
||||
background-color: $active-background;
|
||||
border-color: $active-background;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&:disabled {
|
||||
background-color: $background;
|
||||
border-color: $background;
|
||||
}
|
||||
|
||||
&:not([disabled]):not(.disabled):active {
|
||||
color: $active-color;
|
||||
background-color: $background;
|
||||
border-color: $background;
|
||||
}
|
||||
|
||||
&:not([disabled]):not(.disabled).active,
|
||||
.show > &.dropdown-toggle {
|
||||
color: $active-color;
|
||||
background-color: $active-background;
|
||||
border-color: $active-background;
|
||||
}
|
||||
}
|
||||
|
||||
// Used for buttons that adapt to light/dark header and sidebar variations
|
||||
@mixin button-dual-variant($color, $background) {
|
||||
color: $color;
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.focus {
|
||||
color: $color;
|
||||
background-color: $background;
|
||||
border-color: $background;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
&.disabled,
|
||||
&:disabled {
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
&:not([disabled]):not(.disabled):active {
|
||||
color: $color;
|
||||
background-color: transparent;
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
&:not([disabled]):not(.disabled).active,
|
||||
.show > &.dropdown-toggle {
|
||||
color: $color;
|
||||
background-color: $background;
|
||||
border-color: $background;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user