85 lines
1.4 KiB
SCSS
85 lines
1.4 KiB
SCSS
@mixin social-button($color) {
|
|
background: $color;
|
|
color: color(white);
|
|
|
|
&:hover {
|
|
background: darken($color, 10%);
|
|
}
|
|
|
|
&.btn-link {
|
|
background: none;
|
|
color: $color;
|
|
|
|
&:hover {
|
|
color: darken($color, 10%);
|
|
}
|
|
}
|
|
}
|
|
|
|
@mixin btn-social-outline-variant($color) {
|
|
background: transparent;
|
|
border-color: $color;
|
|
color: $color;
|
|
|
|
&:hover {
|
|
background: rgba($color, 0.2);
|
|
}
|
|
}
|
|
|
|
@mixin button-inverse-variant($color, $color-hover: $white) {
|
|
color: $color;
|
|
background-color: rgba($color, 0.2);
|
|
background-image: none;
|
|
border-color: rgba($color, 0);
|
|
|
|
@include hover {
|
|
color: $color-hover;
|
|
background-color: $color;
|
|
border-color: $color;
|
|
}
|
|
|
|
&.disabled,
|
|
&:disabled {
|
|
color: $color;
|
|
background-color: transparent;
|
|
}
|
|
|
|
&.active,
|
|
&:active,
|
|
.show>&.dropdown-toggle {
|
|
color: $color-hover;
|
|
background-color: $color;
|
|
border-color: $color;
|
|
}
|
|
}
|
|
|
|
@mixin button-inverse-outline-variant($color, $color-hover: $white) {
|
|
color: $color;
|
|
background-image: none;
|
|
background: transparent;
|
|
border-color: rgba($color, 0.2);
|
|
|
|
@include hover {
|
|
color: $color;
|
|
background-color: rgba($color, 0.2);
|
|
border-color: rgba($color, 0.2);
|
|
}
|
|
|
|
&.focus,
|
|
&:focus {
|
|
box-shadow: 0 0 0 3px rgba($color, .5);
|
|
}
|
|
|
|
&.disabled,
|
|
&:disabled {
|
|
color: $color;
|
|
background-color: transparent;
|
|
}
|
|
|
|
&.active,
|
|
&:active,
|
|
.show>&.dropdown-toggle {
|
|
color: $color-hover;
|
|
border-color: $color;
|
|
}
|
|
} |