styles.css (1156B)
1 /* SLIDER STYLING */ 2 /* this is such a pain. why does css have to be so stupid? */ 3 /* after searching for more than an hour and trying 15 different hacks to get 4 * rid of the stupid blue glow around focused input elements in firefox i give 5 * up. such bullshit. */ 6 input[type=range] { 7 /* -moz-appearance: none; */ 8 width: 100%; 9 margin: 0; 10 padding: 0px; 11 background-color: var(--b-bg-1); 12 } 13 input[type=range]::-moz-range-track { 14 width: calc(100% - 8px); 15 height: 4px; 16 background: var(--b-bg-2); 17 border: none; 18 border-radius: 2px; 19 } 20 input[type=range]::-moz-range-thumb { 21 border: none; 22 height: 16px; 23 width: 16px; 24 border-radius: 50%; 25 background: var(--b-link); 26 } 27 28 /* webkit */ 29 input[type=range]{ 30 -webkit-appearance: none; 31 } 32 input[type=range]::-webkit-slider-runnable-track { 33 width: calc(100% - 50px); 34 height: 4px; 35 background: var(--b-bg-2); 36 border: none; 37 border-radius: 2px; 38 } 39 input[type=range]::-webkit-slider-thumb { 40 -webkit-appearance: none; 41 border: none; 42 height: 16px; 43 width: 16px; 44 border-radius: 50%; 45 background: var(--b-link); 46 margin-top: -6px; 47 }