mdbootstrap/mdb-ui-kit
1
1
Fork 0
mirror of https://github.com/mdbootstrap/mdb-ui-kit.git synced 2025-10-31 16:07:53 +03:00
Code Issues Packages Projects Releases Wiki Activity

make checkbox animate quickly when not hover.

Browse Source 
it's not a perfect method. need improve.
by the way. add 'Thumbs.db' and '.DS_Store' to .gitignore.
This commit is contained in:
colder 2014-10-01 13:57:11 +08:00
parent 8767b5425a
commit 7a6aaec9f2
3 changed files with 14 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.gitignore vendored
View File

@ -1,3 +1,6 @@
# https://git-scm.com/docs/gitignore
# https://help.github.com/articles/ignoring-files
# Example .gitignore files: https://github.com/github/gitignore
Thumbs.db
.DS_Store

11
less/checkboxes.less
View File

@ -66,10 +66,17 @@
// Ripple effect on click
input[type=checkbox]:not(:checked) ~ .check:after {
.animation(rippleOff 500ms);
.animation(rippleOff 500ms linear forwards);
}
input[type=checkbox]:checked ~ .check:after {
.animation(rippleOn 500ms);
.animation(rippleOn 500ms linear forwards);
}
// Make animate quickly when not hover
&:not(:hover) input[type=checkbox] ~ .check {
&:before, &:after {
.animation-duration(1ms);
}
}
// Style for disabled inputs

1
less/prefixer.less
View File

@ -98,6 +98,7 @@
-moz-animation-duration: @duration;
-ms-animation-duration: @duration;
-o-animation-duration: @duration;
animation-duration: @duration;
}
.animation-fill-mode(@mode) {
-webkit-animation-fill-mode: @mode;