mirror_css/css-water.css
1
0
Fork 0
mirror of https://github.com/kognise/water.css.git synced 2025-08-22 12:53:25 +02:00
Code Issues Releases Wiki Activity

Add radio and checkbox styles

Browse Source
This commit is contained in:
Kognise
2019-04-18 13:25:23 -04:00
parent c25ba7b427
commit 26ca283dca
6 changed files with 41 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/parts/_forms.scss
View File

@@ -24,10 +24,7 @@ input, select, button, textarea {
border: none;
border-radius: 6px;
outline: none;
}
input:not([type='checkbox']):not([type='radio']),
select, button, textarea {
-webkit-appearance: none;
}
@@ -56,6 +53,36 @@ textarea:focus {
box-shadow: 0 0 0 2px $focus;
}
input[type='checkbox'],
input[type='radio'] {
width: 14px;
height: 14px;
display: inline-block;
vertical-align: middle;
margin: 0;
margin-right: 2px;
}
input[type='radio'] {
border-radius: 50%;
}
input[type='checkbox']:checked,
input[type='radio']:checked {
background: $button-hover;
&::before {
content: '•';
display: block;
transform: translateY(-50%) translateY(-0.3px) translateX(-2.7px);
}
}
input[type='checkbox']:checked::before {
content: '✔';
transform: translateY(-50%) translateY(0.5px) translateX(-6px);
}
input[type='checkbox']:active,
input[type='radio']:active,
input[type='submit']:active,