root
/
bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Merge 9bc48fb5d4 into 4c98145482

This commit is contained in:
Theodore Brown 2025-05-02 08:45:37 +00:00 committed by GitHub
parent 4c98145482 9bc48fb5d4
commit b667666e42
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 24 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
scss/_buttons.scss
View File

@ -156,7 +156,21 @@
@each $color, $value in $theme-colors {
.btn-outline-#{$color} {
@include button-outline-variant($value);
@if $color == "light" {
@include button-outline-variant(
$value,
$hover-background: shade-color($value, $btn-hover-bg-shade-amount),
$active-background: shade-color($value, $btn-active-bg-shade-amount)
);
} @else if $color == "dark" {
@include button-outline-variant(
$value,
$hover-background: tint-color($value, $btn-hover-bg-tint-amount),
$active-background: tint-color($value, $btn-active-bg-tint-amount)
);
} @else {
@include button-outline-variant($value);
}
}
}
// scss-docs-end btn-variant-loops

15
scss/mixins/_buttons.scss
View File

@ -38,16 +38,19 @@
// scss-docs-start btn-outline-variant-mixin
@mixin button-outline-variant(
$color,
$color-hover: color-contrast($color),
$active-background: $color,
$active-border: $color,
$color-contrast: color-contrast($color),
$hover-background: if($color-contrast == $color-contrast-light, shade-color($color, $btn-hover-bg-shade-amount), tint-color($color, $btn-hover-bg-tint-amount)),
$hover-border: $hover-background,
$hover-color: color-contrast($hover-background),
$active-background: if($color-contrast == $color-contrast-light, shade-color($color, $btn-active-bg-shade-amount), tint-color($color, $btn-active-bg-tint-amount)),
$active-border: $active-background,
$active-color: color-contrast($active-background)
) {
--#{$prefix}btn-color: #{$color};
--#{$prefix}btn-border-color: #{$color};
--#{$prefix}btn-hover-color: #{$color-hover};
--#{$prefix}btn-hover-bg: #{$active-background};
--#{$prefix}btn-hover-border-color: #{$active-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($color)};
--#{$prefix}btn-active-color: #{$active-color};
--#{$prefix}btn-active-bg: #{$active-background};