mirror of
https://github.com/Rafostar/clapper.git
synced 2025-08-29 23:32:04 +02:00
A simple borderless window floating on desktop. Window can be resized and moved by dragging. It also has some minimalistic controls showing on top of the video when cursor is hovering over it.\n\n This was a feature originally requested by @zahid1905.
133 lines
2.3 KiB
CSS
133 lines
2.3 KiB
CSS
/* Defaults */
|
|
scale marks {
|
|
color: currentColor;
|
|
}
|
|
.osd {
|
|
text-shadow: none;
|
|
font-size: 22px;
|
|
font-weight: 500;
|
|
}
|
|
.osd .playercontrols {
|
|
-gtk-icon-size: 24px;
|
|
}
|
|
.osd button {
|
|
min-width: 36px;
|
|
min-height: 36px;
|
|
}
|
|
.osd radio {
|
|
margin: 6px;
|
|
border: 2px solid;
|
|
min-width: 18px;
|
|
min-height: 18px;
|
|
}
|
|
.playbackicon {
|
|
-gtk-icon-size: 20px;
|
|
}
|
|
.osd .playbackicon {
|
|
-gtk-icon-size: 28px;
|
|
}
|
|
.labelbutton {
|
|
font-family: 'Cantarell', sans-serif;
|
|
font-variant-numeric: tabular-nums;
|
|
font-weight: 600;
|
|
}
|
|
.videobox {
|
|
background: black;
|
|
}
|
|
.reavealertop {
|
|
min-height: 90px;
|
|
box-shadow: inset 0px 200px 10px -124px rgba(0,0,0,0.3);
|
|
font-family: 'Cantarell', sans-serif;
|
|
font-size: 30px;
|
|
font-weight: 500;
|
|
background: transparent;
|
|
}
|
|
.osdtime {
|
|
margin-top: 0px;
|
|
font-size: 40px;
|
|
font-weight: 700;
|
|
}
|
|
.osdendtime {
|
|
margin-top: 42px;
|
|
font-size: 24px;
|
|
font-weight: 600;
|
|
}
|
|
.osd .labelbutton {
|
|
font-size: 24px;
|
|
}
|
|
|
|
/* Position Scale */
|
|
.positionscale trough highlight {
|
|
min-height: 4px;
|
|
}
|
|
.osd .positionscale trough slider {
|
|
color: transparent;
|
|
background: transparent;
|
|
border-color: transparent;
|
|
box-shadow: none;
|
|
}
|
|
.osd .positionscale {
|
|
margin-top: 2px;
|
|
}
|
|
.osd .positionscale trough highlight {
|
|
border-radius: 3px;
|
|
min-height: 22px;
|
|
}
|
|
.osd .positionscale.dragging trough highlight {
|
|
border-radius: 3px;
|
|
min-height: 22px;
|
|
}
|
|
|
|
/* Volume Scale */
|
|
.volumescale {
|
|
min-height: 180px;
|
|
}
|
|
.osd .volumescale {
|
|
margin: 6px;
|
|
min-height: 280px;
|
|
}
|
|
.volumescale marks label {
|
|
margin-right: 4px;
|
|
margin-top: -4px;
|
|
margin-bottom: -6px;
|
|
}
|
|
.osd .volumescale marks label {
|
|
margin-bottom: -8px;
|
|
}
|
|
.osd .volumescale trough highlight {
|
|
min-width: 6px;
|
|
}
|
|
|
|
/* Floating Mode */
|
|
.floatingwindow {
|
|
background: none;
|
|
border-radius: 12px;
|
|
}
|
|
.osd.floatingcontrols .playercontrols {
|
|
-gtk-icon-size: 16px;
|
|
}
|
|
.osd.floatingcontrols .playbackicon {
|
|
-gtk-icon-size: 20px;
|
|
}
|
|
.osd.floatingcontrols button {
|
|
border-radius: 10px;
|
|
min-width: 24px;
|
|
min-height: 24px;
|
|
}
|
|
.osd.floatingcontrols .positionscale trough highlight {
|
|
border-radius: 3px;
|
|
min-height: 12px;
|
|
}
|
|
.osd.floatingcontrols .positionscale.dragging trough highlight {
|
|
border-radius: 3px;
|
|
min-height: 12px;
|
|
}
|
|
|
|
/* Preferences */
|
|
.prefsnotebook grid {
|
|
margin: 10px;
|
|
}
|
|
.prefssubpage header {
|
|
background: transparent;
|
|
}
|