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

track-size variable introduces for Slider component

Browse source
This commit is contained in:
NikolaBorislavovHristov 2018-12-19 18:18:43 +02:00
parent 0264d2feab
commit 9a15393509
4 changed files with 13 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
src/common/Slider/styles.less
View file

@ -2,8 +2,6 @@
display: inline-block;
position: relative;
z-index: 0;
min-width: var(--thumb-size);
min-height: var(--thumb-size);
cursor: pointer;
.track {
@ -23,29 +21,29 @@
&.horizontal {
.track {
left: 0;
top: calc(50% - var(--track-size) * 0.5);
right: 0;
top: calc(50% - var(--thumb-size) * 0.1);
bottom: calc(50% - var(--thumb-size) * 0.1);
left: 0;
height: var(--track-size);
}
.thumb {
transform: translateX(-50%);
top: calc(50% - var(--thumb-size) * 0.5);
transform: translateX(-50%);
}
}
&.vertical {
.track {
left: calc(50% - var(--thumb-size) * 0.1);
right: calc(50% - var(--thumb-size) * 0.1);
top: 0;
bottom: 0;
left: calc(50% - var(--track-size) * 0.1);
width: var(--track-size);
}
.thumb {
transform: translateY(50%);
left: calc(50% - var(--thumb-size) * 0.5);
transform: translateY(50%);
}
}
}

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

@ -11,9 +11,11 @@
.slider {
--thumb-size: var(--seek-bar-thumb-size);
--track-size: var(--seek-bar-track-size);
--track-color: var(--color-primarydark);
--thumb-color: var(--color-primary);
flex: 1;
align-self: stretch;
margin: 0 var(--seek-bar-thumb-size);
}

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

@ -5,9 +5,11 @@
.slider {
--thumb-size: var(--volume-bar-thumb-size);
--track-size: var(--volume-bar-track-size);
--track-color: var(--color-surfacelight);
--thumb-color: var(--color-surfacelight);
flex: 1;
align-self: stretch;
margin: 0 calc(var(--volume-bar-thumb-size) * 0.5);
}

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

@ -12,6 +12,7 @@
.seek-bar {
--seek-bar-thumb-size: calc(var(--control-bar-button-height) * 0.4);
--seek-bar-track-size: calc(var(--control-bar-button-height) * 0.08);
height: var(--seek-bar-thumb-size);
}
@ -52,7 +53,7 @@
}
.volume-bar {
--volume-bar-thumb-size: calc(var(--control-bar-button-height) * 0.3);
--volume-bar-track-size: calc(var(--control-bar-button-height) * 0.06);
height: var(--control-bar-button-height);
width: calc(var(--control-bar-button-height) * 4);