46 lines
1.1 KiB
SCSS
46 lines
1.1 KiB
SCSS
// Override Bootstrap's breadcrumb component
|
|
|
|
.breadcrumb {
|
|
--#{$prefix}breadcrumb-font-weight: #{$breadcrumb-font-weight};
|
|
--#{$prefix}breadcrumb-color: #{$breadcrumb-color};
|
|
--#{$prefix}breadcrumb-hover-color: #{$breadcrumb-hover-color};
|
|
|
|
flex-direction: row;
|
|
gap: 0;
|
|
font-weight: var(--#{$prefix}breadcrumb-font-weight);
|
|
}
|
|
|
|
.breadcrumb-item {
|
|
> a {
|
|
color: var(--#{$prefix}breadcrumb-color);
|
|
text-decoration: none;
|
|
transition: $breadcrumb-transition;
|
|
|
|
&:hover,
|
|
&:focus-visible {
|
|
color: var(--#{$prefix}breadcrumb-hover-color);
|
|
}
|
|
}
|
|
|
|
+ .breadcrumb-item::before {
|
|
width: 1.125em;
|
|
height: 1.125em;
|
|
padding-right: 0;
|
|
margin-right: var(--#{$prefix}breadcrumb-item-padding-x);
|
|
line-height: 2em;
|
|
}
|
|
}
|
|
|
|
|
|
// Dark mode
|
|
|
|
@if $enable-dark-mode {
|
|
@include color-mode(dark) {
|
|
.breadcrumb:not([data-bs-theme="light"]) {
|
|
.breadcrumb-item + .breadcrumb-item::before {
|
|
content: var(--#{$prefix}breadcrumb-divider, escape-svg($breadcrumb-divider-dark)) #{"/* rtl:"} var(--#{$prefix}breadcrumb-divider, escape-svg($breadcrumb-divider-flipped-dark)) #{"*/"};
|
|
}
|
|
}
|
|
}
|
|
}
|