smokephil/water.css
1
0
Fork 0
mirror of https://github.com/kognise/water.css.git synced 2025-12-06 14:54:58 +01:00
Code Issues Projects Releases Packages Wiki Activity

Merge branch 'master' into bugfix/custom-boxes

Browse source
This commit is contained in:
Kognise 2019-08-26 13:23:15 -04:00
commit 9ba26a1546
No known key found for this signature in database
GPG key ID: 19AA40F6884A36D6
28 changed files with 889 additions and 119 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/parts/_core.css
View file

@ -1,6 +1,7 @@
@import '_base.css';
@import '_typography.css';
@import '_forms.css';
@import '_range.css';
@import '_links.css';
@import '_code.css';
@import '_misc.css';

3
src/parts/_forms.css
View file

@ -2,6 +2,7 @@ button,
input[type='submit'],
input[type='button'],
input[type='checkbox'],
input[type='range'],
input[type='radio'] {
cursor: pointer;
}
@ -12,7 +13,6 @@ select {
}
input,
select,
button,
textarea {
color: var(--form-text);
@ -103,6 +103,7 @@ input[type='checkbox']:active,
input[type='radio']:active,
input[type='submit']:active,
input[type='button']:active,
input[type='range']:active,
button:active {
transform: translateY(2px);
}

87
src/parts/_range.css Normal file
View file

@ -0,0 +1,87 @@
input[type='range'] {
margin: 10px 0;
padding: 10px 0;
background: transparent;
}
input[type='range']:focus {
outline: none;
}
input[type='range']::-webkit-slider-runnable-track {
width: 100%;
height: 9.5px;
transition: 0.2s;
background: var(--background);
border-radius: 3px;
}
input[type='range']::-webkit-slider-thumb {
box-shadow: 0px 1px 1px #000000, 0px 0px 1px #0d0d0d;
height: 20px;
width: 20px;
border-radius: 50%;
background: var(--border);
-webkit-appearance: none;
margin-top: -7px;
}
input[type='range']:focus::-webkit-slider-runnable-track {
background: var(--background);
}
input[type='range']::-moz-range-track {
width: 100%;
height: 9.5px;
transition: 0.2s;
background: var(--background);
border-radius: 3px;
}
input[type='range']::-moz-range-thumb {
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
height: 20px;
width: 20px;
border-radius: 50%;
background: var(--border);
}
input[type='range']::-ms-track {
width: 100%;
height: 9.5px;
background: transparent;
border-color: transparent;
border-width: 16px 0;
color: transparent;
}
input[type='range']::-ms-fill-lower {
background: var(--background);
border: 0.2px solid #010101;
border-radius: 3px;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type='range']::-ms-fill-upper {
background: var(--background);
border: 0.2px solid #010101;
border-radius: 3px;
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type='range']::-ms-thumb {
box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
border: 1px solid #000000;
height: 20px;
width: 20px;
border-radius: 50%;
background: var(--border);
}
input[type='range']:focus::-ms-fill-lower {
background: var(--background);
}
input[type='range']:focus::-ms-fill-upper {
background: var(--background);
}