the-djmaze/snappymail
1
1
Fork 0
mirror of https://github.com/the-djmaze/snappymail.git synced 2025-01-02 21:12:02 +08:00
Code Issues Projects Releases Packages Wiki Activity

Cleanup material-design checkbox

Browse source
This commit is contained in:
the-djmaze 2023-02-06 10:04:00 +01:00
parent 7ffe02c28a
commit b2fdc39670
2 changed files with 5 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
dev/Styles/Components.less
View file

@ -61,6 +61,7 @@
opacity:0;
position:absolute;
top:0;
left:0;
}
&:focus-within {
@ -76,23 +77,18 @@
.e-checkbox.material-design {
line-height: 20px;
padding-left: 18px;
position: relative;
width: auto !important;
> div {
position: relative;
width: 18px;
height: 18px;
vertical-align: top;
}
> div > div {
position: absolute;
margin-top: 1px;
.checkbox-box-sizes();
animation: checkmark-to-box 200ms ease-out forwards;
}
input:checked + div div {
input:checked + div {
.checkbox-mark-sizes();
animation: box-to-checkmark 200ms ease-out forwards;
}

2
snappymail/v/0.0.0/app/templates/Views/Components/Checkbox.html
View file

@ -1,6 +1,6 @@
<label class="e-component e-checkbox material-design" data-bind="css: { 'disabled': !enable() }">
<input type="checkbox" value="1" data-bind="checked: value, enable: enable, attr: {name: name}"/>
<div role="checkbox"><div></div></div>
<div role="checkbox"></div>
<!-- ko if: label -->
<span data-bind="attr: {'data-i18n': label}"></span>
<!-- /ko -->