jellyfin-vue/assets/global.scss

102 lines
2.2 KiB
SCSS

@import '~vuetify/src/styles/styles.sass';
@import '@fontsource/noto-sans/index.css';
@import '@fontsource/noto-sans-jp/index.css';
@import '@fontsource/noto-sans-sc/index.css';
@import '@fontsource/noto-sans-kr/index.css';
@import '@fontsource/noto-sans-tc/index.css';
@import '@fontsource/noto-sans-hk/index.css';
body {
background-color: var(--v-background-base);
}
* {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* W3C standard scrollbars (Firefox-only for now) */
scrollbar-width: thin;
scrollbar-color: var(--v-thumb-lighten5) var(--v-track-base);
}
/* Reproduce something similar on Chrome/Edge/Safari */
*::-webkit-scrollbar {
width: 12px;
}
*::-webkit-scrollbar-track {
background: var(--v-track-base);
}
*::-webkit-scrollbar-thumb {
background-color: var(--v-thumb-lighten5);
border-radius: 20px;
border: 3px solid var(--v-track-base);
}
.nuxt-progress {
/* Override the color with the dynamic color from Vuetify */
background-color: var(--v-primary-base);
}
/* Nuxt transitions */
.page-enter-active,
.page-leave-active,
.layout-enter-active,
.layout-leave-active {
transition: opacity 0.25s;
}
.page-enter,
.page-leave-to,
.layout-enter,
.layout-leave-to {
opacity: 0;
}
/* Vuetify overrides */
// We can't set these through variables, so override them here */
.v-app-bar.v-app-bar--fixed {
z-index: 100 !important;
}
// Cropped text fixes. See https://github.com/vuetifyjs/vuetify/issues/6488 and https://github.com/vuetifyjs/vuetify/issues/4655 */
.text-truncate {
line-height: normal !important;
}
.v-navigation-drawer--fixed,
.v-footer--fixed {
z-index: 100 !important;
}
// It's important for this to be after the rule for .v-navigation-drawer--fixed
.v-navigation-drawer--temporary {
z-index: 105 !important;
}
/* Custom utility classes */
.link {
cursor: pointer;
}
.link:hover {
text-decoration: underline;
}
/* Customized Vuetify components */
.v-menu__content .v-list {
background: map-get($material-light, 'cards') !important;
}
.theme--dark .v-menu__content .v-list {
background: map-get($material-dark, 'menus') !important;
}
.text-capitalize-first-letter::first-letter {
text-transform: uppercase;
}