add initial jellyfin styling

This commit is contained in:
Alexander Bocken 2023-10-27 13:46:30 +02:00
parent 780bca5f96
commit c1c1e9bbc1
Signed by: Alexander
GPG Key ID: 1D237BE83F9B05E8

47
static/other/jellyfin.css Normal file
View File

@ -0,0 +1,47 @@
/*
This file styles jellyfin and can be imported by adding:
@import url("https://bocken.org/other/jellyfin.css");
under Server -> General -> Custom CSS Code
*/
/* jellyscrub default: width: 15vw, annoying for smaller screen sizes */
.chapterThumbContainer{
width: min(80vw, 500px);
}
/* Attempt to change accent color */
:root{
--blue: #5E81AC;
--lightblue: #81A1C1;
--swiper-theme-color: var(--blue);
}
.selectionCommandsPanel,
.countIndicator, .fullSyncIndicator, .mediaSourceIndicator, .playedIndicator,
.itemProgressBarForeground,
.mdl-slider-background-lower,
.iconOsdProgressInner{
background-color: var(--blue);
}
.mdl-slider{
color: var(--blue);
}
@media (hover: hover) and (pointer: fine){
.paper-icon-button-light:hover:not(:disabled) {
color: var(--lightblue);
background-color: rgba(var(--blue), 0.2);
}
}
.mdl-spinner__layer-1,
.mdl-spinner__layer-2,
.mdl-spinner__layer-3{
border-color: var(--blue);
}
input[type="range"]::-moz-range-thumb{
background-color: var(--blue);
}
input[type="range"]::-webkit-slider-thumb{
background-color: var(--blue);
}