Leahnaya/website
1
0
Fork 0
mirror of https://github.com/PretendoNetwork/website.git synced 2026-04-19 15:37:19 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

styles: add range input styling

Browse Source
This commit is contained in:
Ash Monty 2022-07-30 14:01:26 +02:00
parent cbe4079f41
commit a575d1f0bd
No known key found for this signature in database
GPG Key ID: 740B7C88251D49B6
1 changed files with 44 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
public/assets/css/components.css
View File

@ -19,6 +19,9 @@ button:hover,
.button:hover {
background: var(--bg-shade-4);
}
button.inactive {
pointer-events: none;
}
button.primary,
.button.primary {
background: var(--accent-shade-0);
@ -144,3 +147,44 @@ input:focus {
outline: none;
transition: 150ms;
}
input[type="range"] {
background: transparent;
cursor: pointer;
width: 100%;
box-sizing: border-box;
}
input[type="range"]::-webkit-slider-runnable-track {
background: var(--bg-shade-3);
height: 1rem;
border-radius: 1rem;
}
input[type="range"]::-moz-range-track {
background: var(--bg-shade-3);
border-radius: 1rem;
height: 1rem;
}
input[type="range"]::-webkit-slider-thumb {
appearance: none;
-webkit-appearance: none;
width: 1.5rem;
height: 3rem;
margin-top: -1rem;
background-color: var(--accent-shade-1);
border-radius: 0.5rem;
}
input[type="range"]::-moz-range-thumb {
width: 1.5rem;
height: 3rem;
border: none;
border-radius: 0.5rem;
background-color: var(--accent-shade-1);
}
input[type="range"]:focus {
outline: none;
}
input[type="range"]:focus::-webkit-slider-thumb {
background-color: var(--accent-shade-3);
}
input[type="range"]:focus::-moz-range-thumb {
background-color: var(--accent-shade-3);
}