51 lines
1.3 KiB
SCSS
51 lines
1.3 KiB
SCSS
@use "bootstrap/scss/bootstrap" with (
|
|
$color-mode-type: media-query,
|
|
$font-family-sans-serif: (
|
|
"FiraGO",
|
|
system-ui,
|
|
-apple-system,
|
|
"Segoe UI",
|
|
Roboto,
|
|
"Helvetica Neue",
|
|
"Noto Sans",
|
|
"Liberation Sans",
|
|
Arial,
|
|
sans-serif,
|
|
"Apple Color Emoji",
|
|
"Segoe UI Emoji",
|
|
"Segoe UI Symbol",
|
|
"Noto Color Emoji",
|
|
)
|
|
);
|
|
|
|
@import "bootstrap-icons/font/bootstrap-icons.css";
|
|
@import "@fontsource/firago/400.css";
|
|
@import "@fontsource/firago/400-italic.css";
|
|
@import "@fontsource/firago/700.css";
|
|
@import "@fontsource/firago/700-italic.css";
|
|
|
|
// This is necessary for line breaks in translation strings to show up. Don't ask me why
|
|
.text-has-newline {
|
|
white-space: pre-line;
|
|
}
|
|
|
|
// Make tippy tooltips look like bootstrap's
|
|
.tippy-box {
|
|
padding: bootstrap.$spacer * 0.25 bootstrap.$spacer * 0.5;
|
|
opacity: 0.9;
|
|
color: var(--bs-body-bg);
|
|
background-color: var(--bs-emphasis-color);
|
|
border-radius: var(--bs-border-radius);
|
|
}
|
|
|
|
// Add breakpoint-dependent w-{size} utilities
|
|
// Source: https://stackoverflow.com/questions/47760132/any-way-to-get-breakpoint-specific-width-classes
|
|
@each $breakpoint in map-keys(bootstrap.$grid-breakpoints) {
|
|
@each $size, $length in (25: 25%, 50: 50%, 75: 75%, 100: 100%) {
|
|
@include bootstrap.media-breakpoint-up($breakpoint) {
|
|
.w-#{$breakpoint}-#{$size} {
|
|
width: $length !important;
|
|
}
|
|
}
|
|
}
|
|
}
|