Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-03-11 21:27:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

use svg for slider thumb

Browse source
This commit is contained in:
NikolaBorislavovHristov 2019-10-02 23:58:39 +03:00
parent a1619dee93
commit 50ca632822
2 changed files with 5 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/common/Slider/Slider.js
View file

@ -115,7 +115,9 @@ const Slider = ({ className, value, minimumValue, maximumValue, onSlide, onCompl
<div className={styles['track-before']} style={{ width: `calc(100% * ${thumbPosition})` }} />
</div>
<div className={styles['layer']}>
<div className={styles['thumb']} style={{ marginLeft: `calc(100% * ${thumbPosition})` }} />
<svg className={styles['thumb']} style={{ marginLeft: `calc(100% * ${thumbPosition})` }} viewBox={'0 0 100 100'}>
<circle cx={'50'} cy={'50'} r={'50'} />
</svg>
</div>
</div>
);

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

@ -9,7 +9,6 @@ html.active-slider-within {
.slider-container {
position: relative;
z-index: 0;
overflow: visible;
cursor: pointer;
.layer {
@ -37,10 +36,10 @@ html.active-slider-within {
}
.thumb {
flex: none;
width: var(--thumb-size);
height: var(--thumb-size);
border-radius: 50%;
transform: translateX(-50%);
background-color: var(--thumb-color);
fill: var(--thumb-color);
}
}