mirror of
https://github.com/Rafostar/clapper.git
synced 2025-08-29 15:22:11 +02:00
2a18c6a374
Fixes for recent libadwaita provided theme, mainly needed to workaround: https://gitlab.gnome.org/GNOME/libadwaita/-/issues/454 Devs rejected my idea of fixing it upstream. They said to override it in my own app. So here it is.
427 lines
8.1 KiB
CSS
427 lines
8.1 KiB
CSS
/* Defaults */
|
|
scale marks {
|
|
color: currentColor;
|
|
}
|
|
radio {
|
|
margin-left: -2px;
|
|
}
|
|
scrolledwindow scrollbar.vertical slider {
|
|
min-height: 16px;
|
|
}
|
|
|
|
/* Consistent scales color */
|
|
scale trough highlight {
|
|
color: @accent_fg_color;
|
|
background-color: @accent_bg_color;
|
|
}
|
|
/* Consistent radio buttons color */
|
|
.osd radio {
|
|
color: @accent_fg_color;
|
|
background-color: transparent;
|
|
background-image: none;
|
|
}
|
|
.osd radio:hover,
|
|
.osd radio:checked {
|
|
background-image: image(rgba(255,255,255,0.1));
|
|
}
|
|
.osd radio:active {
|
|
background-image: image(rgba(255,255,255,0.3));
|
|
}
|
|
|
|
/* Adwaita OSD background color is unacceptable:
|
|
* https://gitlab.gnome.org/GNOME/libadwaita/-/issues/454 */
|
|
box.osd,
|
|
.osd popover contents,
|
|
.osd popover arrow,
|
|
.osdheaderbar button {
|
|
background-color: rgba(38,38,38,0.78);
|
|
}
|
|
.osdheaderbar button:hover,
|
|
.osdheaderbar button:checked {
|
|
background-color: rgba(63,63,63,0.78);
|
|
}
|
|
.osdheaderbar button:active {
|
|
background-color: rgba(82,82,82,0.78);
|
|
}
|
|
|
|
/* Adwaita is missing osd ListBox */
|
|
.clapperplaylist {
|
|
background: none;
|
|
}
|
|
.clapperplaylist row {
|
|
border-radius: 5px;
|
|
}
|
|
.clapperplaylist row {
|
|
color: @theme_fg_color;
|
|
}
|
|
.clapperplaylist row button {
|
|
margin: 0px;
|
|
padding: 0px;
|
|
min-width: 28px;
|
|
min-height: 28px;
|
|
}
|
|
.fullscreen.tvmode .clapperplaylist row button {
|
|
min-width: 36px;
|
|
min-height: 36px;
|
|
margin-left: 2px;
|
|
margin-right: 2px;
|
|
}
|
|
.osd .clapperplaylist row image {
|
|
-gtk-icon-shadow: none;
|
|
}
|
|
.osdheaderbar {
|
|
background: transparent;
|
|
}
|
|
.osdheaderbar button {
|
|
border: transparent;
|
|
}
|
|
.linkseparator {
|
|
background: rgba(24,24,24,0.72);
|
|
min-width: 1px;
|
|
}
|
|
.linkedleft image {
|
|
margin-left: 2px;
|
|
}
|
|
.linkedright image {
|
|
margin-right: 2px;
|
|
}
|
|
|
|
/* Flat popovers */
|
|
popover arrow,
|
|
popover contents {
|
|
border-color: transparent;
|
|
box-shadow: none;
|
|
}
|
|
.popoverseparator separator {
|
|
background-color: @insensitive_fg_color;
|
|
margin-left: 3px;
|
|
margin-right: 3px;
|
|
}
|
|
|
|
/* Rounded corners */
|
|
.adwrounded.csd {
|
|
border-radius: 8px;
|
|
}
|
|
.adwrounded.fullscreen,
|
|
.adwrounded.maximized,
|
|
.adwrounded.tiled,
|
|
.adwrounded.tiled-top,
|
|
.adwrounded.tiled-left,
|
|
.adwrounded.tiled-right,
|
|
.adwrounded.tiled-bottom {
|
|
border-radius: 0px;
|
|
}
|
|
.roundedcorners {
|
|
border-radius: 8px;
|
|
}
|
|
|
|
/* Reduce sliders size */
|
|
scale trough slider {
|
|
min-height: 18px;
|
|
min-width: 18px;
|
|
}
|
|
.fullscreen.tvmode scale trough slider {
|
|
min-height: 20px;
|
|
min-width: 20px;
|
|
}
|
|
|
|
.videowidget {
|
|
min-width: 320px;
|
|
min-height: 180px;
|
|
}
|
|
|
|
.fullscreen.tvmode popover box {
|
|
text-shadow: none;
|
|
font-size: 21px;
|
|
font-weight: 500;
|
|
}
|
|
.clappercontrols {
|
|
margin-left: 2px;
|
|
margin-right: 2px;
|
|
}
|
|
.fullscreen.tvmode .clappercontrols {
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
}
|
|
.clappercontrolsbutton {
|
|
margin: 3px;
|
|
margin-left: 1px;
|
|
margin-right: 1px;
|
|
}
|
|
.fullscreen.tvmode .clappercontrolsbutton {
|
|
min-width: 32px;
|
|
min-height: 32px;
|
|
margin: 5px;
|
|
margin-left: 4px;
|
|
margin-right: 4px;
|
|
}
|
|
.clappercontrolsbutton.text-button {
|
|
padding-left: 4px;
|
|
padding-right: 4px;
|
|
}
|
|
.fullscreen.tvmode button image {
|
|
-gtk-icon-shadow: none;
|
|
}
|
|
.fullscreen.tvmode radio {
|
|
margin-left: 0px;
|
|
margin-right: 4px;
|
|
border: 2px solid;
|
|
min-width: 16px;
|
|
min-height: 16px;
|
|
box-shadow: none;
|
|
}
|
|
|
|
/* Also affects popover buttons */
|
|
.fullscreen.tvmode .clappercontrols button image {
|
|
-gtk-icon-size: 26px;
|
|
}
|
|
.clappercontrolsbutton.text-button label {
|
|
font-family: 'Cantarell', sans-serif;
|
|
font-variant-numeric: tabular-nums;
|
|
font-weight: 600;
|
|
}
|
|
.fullscreen.tvmode .clappercontrolsbutton.text-button label {
|
|
font-size: 22px;
|
|
text-shadow: none;
|
|
}
|
|
|
|
/* Top Revealer */
|
|
.fullscreen.tvmode .revealertopgrid {
|
|
font-family: 'Cantarell', sans-serif;
|
|
}
|
|
.fullscreen.tvmode .tvtitle {
|
|
font-size: 28px;
|
|
font-weight: 500;
|
|
text-shadow: none;
|
|
}
|
|
.fullscreen.tvmode .tvtime {
|
|
margin-top: -2px;
|
|
margin-bottom: -2px;
|
|
min-height: 4px;
|
|
font-size: 38px;
|
|
font-weight: 700;
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
.fullscreen.tvmode .tvendtime {
|
|
margin-top: -4px;
|
|
margin-bottom: 2px;
|
|
min-height: 6px;
|
|
font-size: 24px;
|
|
font-weight: 600;
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
/* Position Scale */
|
|
.positionscale {
|
|
margin: -2px;
|
|
}
|
|
.positionscale trough highlight {
|
|
min-height: 6px;
|
|
}
|
|
.fullscreen.tvmode .positionscale {
|
|
padding-left: 12px;
|
|
padding-right: 12px;
|
|
}
|
|
.fullscreen.tvmode .positionscale.fine-tune {
|
|
padding-left: 12px;
|
|
padding-right: 12px;
|
|
}
|
|
.fullscreen.tvmode .positionscale trough slider {
|
|
color: transparent;
|
|
background: transparent;
|
|
border-color: transparent;
|
|
box-shadow: none;
|
|
outline: none;
|
|
}
|
|
.positionscale mark indicator {
|
|
min-height: 6px;
|
|
}
|
|
.positionscale.fine-tune mark indicator {
|
|
min-height: 6px;
|
|
}
|
|
.fullscreen.tvmode .positionscale mark indicator {
|
|
min-height: 7px;
|
|
min-width: 2px;
|
|
}
|
|
.fullscreen.tvmode .positionscale.fine-tune mark indicator {
|
|
min-height: 7px;
|
|
min-width: 2px;
|
|
}
|
|
.positionscale marks.top {
|
|
margin-top: -6px;
|
|
margin-bottom: 4px;
|
|
}
|
|
.positionscale marks.bottom {
|
|
margin-top: 4px;
|
|
margin-bottom: -6px;
|
|
}
|
|
.fullscreen.tvmode .positionscale marks.top {
|
|
margin-bottom: 2px;
|
|
}
|
|
.fullscreen.tvmode .positionscale marks.bottom {
|
|
margin-top: 2px;
|
|
}
|
|
.fullscreen.tvmode .positionscale trough {
|
|
border-radius: 3px;
|
|
}
|
|
.fullscreen.tvmode .positionscale trough highlight {
|
|
border-radius: 3px;
|
|
min-height: 20px;
|
|
}
|
|
.fullscreen.tvmode .positionscale.fine-tune trough highlight {
|
|
border-radius: 3px;
|
|
min-height: 20px;
|
|
}
|
|
|
|
/* Volume Scale */
|
|
.volumescale {
|
|
margin: -2px;
|
|
margin-left: -8px;
|
|
margin-right: -6px;
|
|
min-height: 180px;
|
|
}
|
|
.fullscreen.tvmode .volumescale {
|
|
margin: 2px;
|
|
margin-left: -6px;
|
|
margin-right: -4px;
|
|
min-height: 260px;
|
|
}
|
|
.volumescale marks label {
|
|
margin-right: 4px;
|
|
margin-top: -4px;
|
|
margin-bottom: -6px;
|
|
}
|
|
.volumescale trough highlight {
|
|
min-width: 4px;
|
|
}
|
|
.fullscreen.tvmode .volumescale trough highlight {
|
|
min-width: 6px;
|
|
}
|
|
.overamp trough highlight {
|
|
color: @error_fg_color;
|
|
background-color: @error_bg_color;
|
|
}
|
|
|
|
/* Elapsed Popover */
|
|
.elapsedpopover {
|
|
min-width: 326px;
|
|
}
|
|
.fullscreen.tvmode .elapsedpopover {
|
|
min-width: 448px;
|
|
}
|
|
.elapsedpopover contents {
|
|
padding-bottom: 0px;
|
|
}
|
|
.speedscale {
|
|
margin-left: 4px;
|
|
margin-right: 4px;
|
|
}
|
|
.speedscale trough highlight {
|
|
min-height: 4px;
|
|
}
|
|
.fullscreen.tvmode .speedscale trough highlight {
|
|
min-height: 6px;
|
|
}
|
|
|
|
.narrowbutton {
|
|
min-width: 8px;
|
|
}
|
|
@keyframes halfrotation {
|
|
to { transform: rotate(0.5turn); }
|
|
}
|
|
.halfrotate {
|
|
animation-name: halfrotation;
|
|
animation-duration: 200ms;
|
|
animation-delay: 280ms;
|
|
animation-timing-function: linear;
|
|
animation-fill-mode: forwards;
|
|
animation-iteration-count: 1;
|
|
}
|
|
|
|
/* Chapters */
|
|
.chapterlabel {
|
|
min-width: 32px;
|
|
}
|
|
.fullscreen.tvmode .chapterlabel {
|
|
min-width: 40px;
|
|
text-shadow: none;
|
|
font-size: 22px;
|
|
font-weight: 600;
|
|
}
|
|
|
|
/* Open URI Dialog */
|
|
.uridialogbox {
|
|
margin: 10px;
|
|
}
|
|
|
|
/* Tweaks */
|
|
.nobackground {
|
|
background: none;
|
|
}
|
|
.noborder {
|
|
border: none;
|
|
}
|
|
.controlsbox {
|
|
background: @popover_bg_color;
|
|
}
|
|
.gpufriendly {
|
|
box-shadow: -8px -8px transparent, 8px 8px transparent;
|
|
}
|
|
.fullscreen.gpufriendlyfs {
|
|
box-shadow: none;
|
|
}
|
|
|
|
/* Error BG */
|
|
.blackbackground {
|
|
background: black;
|
|
}
|
|
|
|
/** SCALING LOW-RES **/
|
|
.fullscreen.tvmode.lowres .clappercontrols button image {
|
|
-gtk-icon-size: 22px;
|
|
}
|
|
.fullscreen.tvmode.lowres .clappercontrolsbutton {
|
|
min-width: 28px;
|
|
min-height: 28px;
|
|
}
|
|
.fullscreen.tvmode.lowres .clappercontrolsbutton.text-button label {
|
|
font-size: 21px;
|
|
}
|
|
.fullscreen.tvmode.lowres .positionscale trough highlight {
|
|
min-height: 18px;
|
|
}
|
|
.fullscreen.tvmode.lowres .positionscale.fine-tune trough highlight {
|
|
min-height: 18px;
|
|
}
|
|
.fullscreen.tvmode.lowres popover box {
|
|
font-size: 19px;
|
|
}
|
|
.fullscreen.tvmode.lowres radio {
|
|
min-width: 15px;
|
|
min-height: 15px;
|
|
}
|
|
.fullscreen.tvmode.lowres .clapperplaylist row button {
|
|
min-width: 32px;
|
|
min-height: 32px;
|
|
}
|
|
.fullscreen.tvmode.lowres .tvtitle {
|
|
font-size: 26px;
|
|
}
|
|
.fullscreen.tvmode.lowres .tvtime {
|
|
font-size: 34px;
|
|
}
|
|
.fullscreen.tvmode.lowres .tvendtime {
|
|
font-size: 21px;
|
|
}
|
|
.fullscreen.tvmode.lowres .elapsedpopover {
|
|
min-width: 410px;
|
|
}
|
|
.fullscreen.tvmode.lowres .chapterlabel {
|
|
font-size: 21px;
|
|
}
|
|
|
|
/** SCALING HI-RES **/
|
|
.fullscreen.tvmode.hires .clappercontrols button image {
|
|
-gtk-icon-size: 24px; /* Sharpest on 2160p with scaling 2x */
|
|
}
|