Commander1024/lostplaces-frontend
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Checking Atoms

Browse Source
This commit is contained in:
reverend
2021-10-18 16:01:28 +02:00
parent e775c11cc2
commit 2ba096e8f0
6 changed files with 21 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
components/01_Atoms/checkbox/_checkbox.scss
View File

@@ -1,12 +1,16 @@
.LP-Form{
.LP-Form__Checkbox{
display: none;
display: none;
&:checked + .LP-Form__CheckBox__CheckMark {
background-color: $-light-brown;
}
}
.LP-Form__CheckBox__CheckMark{
height: 1em;
width: 1em;
border: 1px solid black;
border: 1px solid $-grey;
padding: 0 calc(.5em + 2px);
margin-right: .7em;
}

6
components/01_Atoms/checkbox/checkbox.hbs
View File

@@ -1,3 +1,7 @@
<form class="LP-Form">
<label for="wurstwasser" class="LP-Form__Label"><span class="LP-Form__CheckBox__CheckMark"></span><input id="wurstwasser" type="checkbox" class="LP-Form__Checkbox"/>Check me</label>
<label for="wurstwasser" class="LP-Form__Label">
<input id="wurstwasser" type="checkbox" class="LP-Form__Checkbox"/>
<span class="LP-Form__CheckBox__CheckMark"></span>
Check me
</label>
</form>