60 lines
No EOL
1.4 KiB
SCSS
60 lines
No EOL
1.4 KiB
SCSS
//Custom Mixins
|
|
|
|
//Blue gradient background mixin
|
|
@mixin blue-gradient {
|
|
background: linear-gradient(270deg, $blue 0%, $blue-800 100%);
|
|
}
|
|
|
|
@mixin box-shadow-hover($color) {
|
|
box-shadow: 0 0 0 4px $color;
|
|
}
|
|
|
|
@mixin heritage-btn-box-shadow($color) {
|
|
box-shadow:0 0 0 3px $white,0 0 0 5.5px $color
|
|
}
|
|
|
|
@mixin heritage-btn-variant($name, $color, $background, $border-color, $box-shadow) {
|
|
&.btn-#{$name} {
|
|
@include button-variant($background,
|
|
$border-color,
|
|
$color,
|
|
#{darken($background, 10%)},
|
|
$border-color,
|
|
$color,
|
|
$background,
|
|
$border-color,
|
|
$color,
|
|
$background,
|
|
$border-color,
|
|
$color
|
|
);
|
|
@if($box-shadow) {
|
|
&:focus, &:active, &:active:focus {
|
|
@include heritage-btn-box-shadow($background);
|
|
}
|
|
}
|
|
}
|
|
&.btn-outline-#{$name} {
|
|
@include button-outline-variant($background,
|
|
$color,
|
|
$background,
|
|
$color,
|
|
$background
|
|
);
|
|
}
|
|
}
|
|
|
|
@mixin heritage-btn-size($size, $y-padding, $x-padding) {
|
|
&.btn-#{$size} {
|
|
@include button-size($y-padding, $x-padding, $font-size-base, $heritage-btn-border-radius);
|
|
}
|
|
}
|
|
|
|
@mixin heritage-btn-link($name, $color, $background, $hover-color) {
|
|
&.btn-#{$name} {
|
|
--bs-btn-color: #{$color};
|
|
--bs-btn-bg: #{$background};
|
|
--bs-btn-hover-color: #{$hover-color};
|
|
--bs-btn-active-color: #{$hover-color};
|
|
}
|
|
} |