owntone-server/web-src/src/mystyles.scss
2025-05-17 09:20:31 +02:00

67 lines
1.3 KiB
SCSS

@charset "utf-8";
@use 'bulma/bulma';
@use 'bulma/sass/utilities/mixins';
@media (prefers-color-scheme: dark) {
.navbar {
background-color: var(--bulma-dark);
&-item {
--bulma-navbar-item-color: hsl(
var(--bulma-navbar-invert-h),
var(--bulma-navbar-invert-s),
var(--bulma-navbar-item-color-invert-l)
);
--bulma-navbar-item-background-l: var(--bulma-light-invert-l);
}
}
}
button.navbar-item {
background-color: hsla(
var(--bulma-navbar-h),
var(--bulma-navbar-s),
calc(
var(--bulma-navbar-item-background-l) +
var(--bulma-navbar-item-background-l-delta)
),
var(--bulma-navbar-item-background-a)
);
&:hover {
--bulma-navbar-item-background-l-delta: var(
--bulma-navbar-item-hover-background-l-delta
);
--bulma-navbar-item-background-a: 1;
}
}
.navbar-item {
width: var(--bulma-navbar-height);
justify-content: center;
}
.media:first-of-type {
padding-top: 1rem;
}
.modal-background {
background-color: rgba(10, 10, 10, 0.5);
}
.overlay-fullscreen {
@extend .is-overlay;
z-index: 25;
background-color: rgba(10, 10, 10, 0.5);
position: fixed;
}
.dropdown-menu.is-mobile {
@include mixins.mobile {
width: 100vw;
}
.dropdown-content {
max-height: calc(100vh - calc(2 * var(--bulma-navbar-height)));
overflow: auto;
}
}