Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-04-20 06:32:11 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

styler styles in player updated

Browse source
This commit is contained in:
NikolaBorislavovHristov 2018-12-21 12:21:36 +02:00
parent 53018e4101
commit 82c2001ec6
3 changed files with 20 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/routes/Player/ControlBar/SeekBar/styles.less
View file

@ -4,15 +4,16 @@
align-items: center;
.label {
font-size: calc(var(--seek-bar-thumb-size) * 0.7);
font-size: var(--seek-bar-font-size);
color: var(--color-surfacelight);
}
.slider {
--thumb-size: var(--seek-bar-thumb-size);
--track-size: calc(var(--seek-bar-thumb-size) * 0.2);
--track-color: var(--color-primarydark);
--thumb-color: var(--color-primary);
--track-size: var(--seek-bar-track-size);
--track-before-color: var(--color-primary);
--track-color: var(--color-backgroundlighter);
--thumb-color: transparent;
flex: 1;
align-self: stretch;
margin: 0 var(--seek-bar-thumb-size);
@ -24,7 +25,8 @@
}
.slider {
--thumb-color: var(--color-primarylight);
--track-before-color: var(--color-primarylight);
--thumb-color: var(--color-surfacelighter);
}
}
}

10
src/routes/Player/ControlBar/VolumeBar/styles.less
View file

@ -5,17 +5,19 @@
.slider {
--thumb-size: var(--volume-bar-thumb-size);
--track-size: calc(var(--volume-bar-thumb-size) * 0.2);
--thumb-color: var(--color-surfacelight);
--track-color: var(--color-surfacelight);
--track-size: var(--volume-bar-track-size);
--track-before-color: var(--color-primary);
--track-color: var(--color-backgroundlighter);
--thumb-color: transparent;
flex: 1;
align-self: stretch;
margin: 0 calc(var(--volume-bar-thumb-size) / 2);
}
&:hover, &.active {
.slider {
--track-before-color: var(--color-primarylight);
--thumb-color: var(--color-surfacelighter);
--track-color: var(--color-surfacelighter);
}
}
}

11
src/routes/Player/ControlBar/styles.less
View file

@ -11,8 +11,10 @@
align-items: stretch;
.seek-bar {
--seek-bar-thumb-size: calc(var(--control-bar-button-height) * 0.5);
height: var(--seek-bar-thumb-size);
--seek-bar-thumb-size: calc(var(--control-bar-button-height) * 0.40);
--seek-bar-track-size: calc(var(--control-bar-button-height) * 0.12);
--seek-bar-font-size: calc(var(--control-bar-button-height) * 0.35);
height: calc(var(--control-bar-button-height) * 0.6);
}
.control-bar-buttons-container {
@ -52,9 +54,10 @@
}
.volume-bar {
--volume-bar-thumb-size: calc(var(--control-bar-button-height) * 0.4);
--volume-bar-thumb-size: calc(var(--control-bar-button-height) * 0.36);
--volume-bar-track-size: calc(var(--control-bar-button-height) * 0.10);
height: var(--control-bar-button-height);
width: calc(var(--control-bar-button-height) * 4);
width: calc(var(--control-bar-button-height) * 5);
&:hover, &.active {
.control-bar-button {