From 4965c178520197bf97a59f58b84bc5fe0945834a Mon Sep 17 00:00:00 2001 From: lokesh-coder Date: Wed, 20 Jul 2016 17:33:06 +0530 Subject: [PATCH] minor animation fix for radio buttons --- package.json | 2 +- src/pretty.css | 14 ++++++++++++++ src/pretty.min.css | 2 +- src/scss/decorators/_animation.scss | 8 ++++++++ 4 files changed, 24 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index c80d31e..a4614dc 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "pretty-checkbox", - "version": "2.0.1", + "version": "2.0.2", "description": "Scalable css3 pretty checkbox and radio buttons with custom font icon library", "main": "src/pretty.min.css", "dependencies": {}, diff --git a/src/pretty.css b/src/pretty.css index 3074f20..0aef882 100644 --- a/src/pretty.css +++ b/src/pretty.css @@ -565,6 +565,20 @@ i[class*="ion-"] { transform: scale(0); } +.pretty.smooth > input[type='radio']:checked ~ label > i.default:before { + -webkit-transform: scale(0.8); + -moz-transform: scale(0.8); + -o-transform: scale(0.8); + transform: scale(0.8); +} + +.pretty.smooth > input[type='radio']:checked ~ label > i.default:after { + -webkit-transform: scale(1); + -moz-transform: scale(1); + -o-transform: scale(1); + transform: scale(1); +} + .pretty.smooth.toggle i:before { -webkit-transform: none; -moz-transform: none; diff --git a/src/pretty.min.css b/src/pretty.min.css index 0612c65..d1c11eb 100644 --- a/src/pretty.min.css +++ b/src/pretty.min.css @@ -1 +1 @@ -@keyframes popIn{0%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@-webkit-keyframes popIn{0%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@-moz-keyframes popIn{0%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@-o-keyframes popIn{0%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@keyframes popOut{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}}@-webkit-keyframes popOut{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}}@-moz-keyframes popOut{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}}@-o-keyframes popOut{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}}.pretty{position:relative;line-height:1;margin-bottom:5px}.pretty label{font-weight:normal}.pretty>input[type='checkbox'],.pretty>input[type='radio']{position:absolute;display:block;left:0;top:0;height:100%;width:100%;opacity:0;margin:0;cursor:pointer;z-index:99999999}.pretty i:before{margin-right:5px;vertical-align:bottom;display:inline-block;color:transparent;position:relative;z-index:999;left:-1px}.pretty i:after{content:'\0000';border-radius:2px;border:1px solid #aaa;position:absolute;color:transparent;left:-1px;top:-1px}.pretty>input[type='checkbox']:checked+label>i:before,.pretty>input[type='radio']:checked+label>i:before{color:inherit}.pretty>input[type='radio']+label>i.default:before{content:'\0000';border-radius:2px;-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8);color:transparent;background:transparent;left:0}.pretty>input[type='radio']:checked+label>i.default:before{background:#aaa}.pretty>input[type='checkbox'][disabled],.pretty>input[type='radio'][disabled]{cursor:not-allowed;opacity:0}.pretty>input[type='checkbox'][disabled]+label,.pretty>input[type='radio'][disabled]+label{opacity:0.5;cursor:not-allowed}.pretty.inline{display:inline-block;margin-right:20px}.pretty.plain>input[type='checkbox']:checked+label>i:after,.pretty.plain>input[type='radio']:checked+label>i:after{border-color:transparent}.pretty.plain>input[type='checkbox']+label+label>i:after,.pretty.plain>input[type='radio']+label+label>i:after{border-color:transparent}.pretty.plain>input[type='checkbox']:checked+label+label>i:after,.pretty.plain>input[type='radio']:checked+label+label>i:after{border-color:transparent}.pretty.plain.toggle>input[type='checkbox']+label>i:after,.pretty.plain.toggle>input[type='radio']+label>i:after{border-color:transparent}.pretty.circle label i:after{border-radius:100px}.pretty.circle label i.default:before{border-radius:100px !important}.pretty.primary input:checked+label i:before{color:#fff}.pretty.primary input:checked+label i:after{background-color:#428bca;border-color:#428bca}.pretty.primary input[type='radio']:checked+label i.default:before{background-color:#428bca;color:transparent}.pretty.primary input[type='radio']:checked+label i.default:after{background-color:initial;border-color:#428bca}.pretty.primary.smooth input:checked ~ label i:after{-webkit-transform:scale(1) !important;-moz-transform:scale(1) !important;-o-transform:scale(1) !important;transform:scale(1) !important}.pretty.outline-primary input:checked+label i:before{color:#428bca}.pretty.outline-primary input:checked+label i:after{border-color:#428bca}.pretty.toggle i.primary:before{color:#428bca !important}.pretty.toggle i.success:before{color:#5cb85c !important}.pretty.toggle i.info:before{color:#5bc0de !important}.pretty.toggle i.warning:before{color:#f0ad4e !important}.pretty.toggle i.danger:before{color:#d9534f !important}.pretty.success input:checked+label i:before{color:#fff}.pretty.success input:checked+label i:after{background-color:#5cb85c;border-color:#5cb85c}.pretty.success input[type='radio']:checked+label i.default:before{background-color:#5cb85c;color:transparent}.pretty.success input[type='radio']:checked+label i.default:after{background-color:initial;border-color:#5cb85c}.pretty.success.smooth input:checked ~ label i:after{-webkit-transform:scale(1) !important;-moz-transform:scale(1) !important;-o-transform:scale(1) !important;transform:scale(1) !important}.pretty.outline-success input:checked+label i:before{color:#5cb85c}.pretty.outline-success input:checked+label i:after{border-color:#5cb85c}.pretty.toggle i.primary:before{color:#428bca !important}.pretty.toggle i.success:before{color:#5cb85c !important}.pretty.toggle i.info:before{color:#5bc0de !important}.pretty.toggle i.warning:before{color:#f0ad4e !important}.pretty.toggle i.danger:before{color:#d9534f !important}.pretty.info input:checked+label i:before{color:#fff}.pretty.info input:checked+label i:after{background-color:#5bc0de;border-color:#5bc0de}.pretty.info input[type='radio']:checked+label i.default:before{background-color:#5bc0de;color:transparent}.pretty.info input[type='radio']:checked+label i.default:after{background-color:initial;border-color:#5bc0de}.pretty.info.smooth input:checked ~ label i:after{-webkit-transform:scale(1) !important;-moz-transform:scale(1) !important;-o-transform:scale(1) !important;transform:scale(1) !important}.pretty.outline-info input:checked+label i:before{color:#5bc0de}.pretty.outline-info input:checked+label i:after{border-color:#5bc0de}.pretty.toggle i.primary:before{color:#428bca !important}.pretty.toggle i.success:before{color:#5cb85c !important}.pretty.toggle i.info:before{color:#5bc0de !important}.pretty.toggle i.warning:before{color:#f0ad4e !important}.pretty.toggle i.danger:before{color:#d9534f !important}.pretty.warning input:checked+label i:before{color:#fff}.pretty.warning input:checked+label i:after{background-color:#f0ad4e;border-color:#f0ad4e}.pretty.warning input[type='radio']:checked+label i.default:before{background-color:#f0ad4e;color:transparent}.pretty.warning input[type='radio']:checked+label i.default:after{background-color:initial;border-color:#f0ad4e}.pretty.warning.smooth input:checked ~ label i:after{-webkit-transform:scale(1) !important;-moz-transform:scale(1) !important;-o-transform:scale(1) !important;transform:scale(1) !important}.pretty.outline-warning input:checked+label i:before{color:#f0ad4e}.pretty.outline-warning input:checked+label i:after{border-color:#f0ad4e}.pretty.toggle i.primary:before{color:#428bca !important}.pretty.toggle i.success:before{color:#5cb85c !important}.pretty.toggle i.info:before{color:#5bc0de !important}.pretty.toggle i.warning:before{color:#f0ad4e !important}.pretty.toggle i.danger:before{color:#d9534f !important}.pretty.danger input:checked+label i:before{color:#fff}.pretty.danger input:checked+label i:after{background-color:#d9534f;border-color:#d9534f}.pretty.danger input[type='radio']:checked+label i.default:before{background-color:#d9534f;color:transparent}.pretty.danger input[type='radio']:checked+label i.default:after{background-color:initial;border-color:#d9534f}.pretty.danger.smooth input:checked ~ label i:after{-webkit-transform:scale(1) !important;-moz-transform:scale(1) !important;-o-transform:scale(1) !important;transform:scale(1) !important}.pretty.outline-danger input:checked+label i:before{color:#d9534f}.pretty.outline-danger input:checked+label i:after{border-color:#d9534f}.pretty.toggle i.primary:before{color:#428bca !important}.pretty.toggle i.success:before{color:#5cb85c !important}.pretty.toggle i.info:before{color:#5bc0de !important}.pretty.toggle i.warning:before{color:#f0ad4e !important}.pretty.toggle i.danger:before{color:#d9534f !important}.pretty.toggle>input[type='checkbox']+label>i:before,.pretty.toggle>input[type='radio']+label>i:before{color:inherit}.pretty.toggle>input[type='checkbox']+label+label,.pretty.toggle>input[type='radio']+label+label{display:none}.pretty.toggle>input[type='checkbox']:checked+label,.pretty.toggle>input[type='radio']:checked+label{display:none}.pretty.toggle>input[type='checkbox']:checked+label+label,.pretty.toggle>input[type='radio']:checked+label+label{display:inline-block}.pretty.toggle>input[type='checkbox']:checked+label+label>i:before,.pretty.toggle>input[type='radio']:checked+label+label>i:before{color:inherit}.zmdi{padding-left:2px !important}i[class*="ion-"]{padding-left:2px}.pretty.smooth i:before{-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease;-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}.pretty.smooth i:after{-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease}.pretty.smooth>input[type='checkbox']:checked ~ label>i:before,.pretty.smooth>input[type='radio']:checked ~ label>i:before{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}.pretty.smooth>input[type='checkbox']:checked ~ label>i:after,.pretty.smooth>input[type='radio']:checked ~ label>i:after{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}.pretty.smooth.toggle i:before{-webkit-transform:none;-moz-transform:none;-o-transform:none;transform:none}.pretty.smooth.toggle>input[type='checkbox']:checked ~ label>i:before,.pretty.smooth.toggle>input[type='radio']:checked ~ label>i:before{-webkit-transform:none;-moz-transform:none;-o-transform:none;transform:none}.pretty.smooth.toggle>input[type='checkbox']:checked ~ label>i:after,.pretty.smooth.toggle>input[type='radio']:checked ~ label>i:after{-webkit-transform:none;-moz-transform:none;-o-transform:none;transform:none} +@keyframes popIn{0%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@-webkit-keyframes popIn{0%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@-moz-keyframes popIn{0%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@-o-keyframes popIn{0%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@keyframes popOut{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}}@-webkit-keyframes popOut{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}}@-moz-keyframes popOut{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}}@-o-keyframes popOut{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}}.pretty{position:relative;line-height:1;margin-bottom:5px}.pretty label{font-weight:normal}.pretty>input[type='checkbox'],.pretty>input[type='radio']{position:absolute;display:block;left:0;top:0;height:100%;width:100%;opacity:0;margin:0;cursor:pointer;z-index:99999999}.pretty i:before{margin-right:5px;vertical-align:bottom;display:inline-block;color:transparent;position:relative;z-index:999;left:-1px}.pretty i:after{content:'\0000';border-radius:2px;border:1px solid #aaa;position:absolute;color:transparent;left:-1px;top:-1px}.pretty>input[type='checkbox']:checked+label>i:before,.pretty>input[type='radio']:checked+label>i:before{color:inherit}.pretty>input[type='radio']+label>i.default:before{content:'\0000';border-radius:2px;-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8);color:transparent;background:transparent;left:0}.pretty>input[type='radio']:checked+label>i.default:before{background:#aaa}.pretty>input[type='checkbox'][disabled],.pretty>input[type='radio'][disabled]{cursor:not-allowed;opacity:0}.pretty>input[type='checkbox'][disabled]+label,.pretty>input[type='radio'][disabled]+label{opacity:0.5;cursor:not-allowed}.pretty.inline{display:inline-block;margin-right:20px}.pretty.plain>input[type='checkbox']:checked+label>i:after,.pretty.plain>input[type='radio']:checked+label>i:after{border-color:transparent}.pretty.plain>input[type='checkbox']+label+label>i:after,.pretty.plain>input[type='radio']+label+label>i:after{border-color:transparent}.pretty.plain>input[type='checkbox']:checked+label+label>i:after,.pretty.plain>input[type='radio']:checked+label+label>i:after{border-color:transparent}.pretty.plain.toggle>input[type='checkbox']+label>i:after,.pretty.plain.toggle>input[type='radio']+label>i:after{border-color:transparent}.pretty.circle label i:after{border-radius:100px}.pretty.circle label i.default:before{border-radius:100px !important}.pretty.primary input:checked+label i:before{color:#fff}.pretty.primary input:checked+label i:after{background-color:#428bca;border-color:#428bca}.pretty.primary input[type='radio']:checked+label i.default:before{background-color:#428bca;color:transparent}.pretty.primary input[type='radio']:checked+label i.default:after{background-color:initial;border-color:#428bca}.pretty.primary.smooth input:checked ~ label i:after{-webkit-transform:scale(1) !important;-moz-transform:scale(1) !important;-o-transform:scale(1) !important;transform:scale(1) !important}.pretty.outline-primary input:checked+label i:before{color:#428bca}.pretty.outline-primary input:checked+label i:after{border-color:#428bca}.pretty.toggle i.primary:before{color:#428bca !important}.pretty.toggle i.success:before{color:#5cb85c !important}.pretty.toggle i.info:before{color:#5bc0de !important}.pretty.toggle i.warning:before{color:#f0ad4e !important}.pretty.toggle i.danger:before{color:#d9534f !important}.pretty.success input:checked+label i:before{color:#fff}.pretty.success input:checked+label i:after{background-color:#5cb85c;border-color:#5cb85c}.pretty.success input[type='radio']:checked+label i.default:before{background-color:#5cb85c;color:transparent}.pretty.success input[type='radio']:checked+label i.default:after{background-color:initial;border-color:#5cb85c}.pretty.success.smooth input:checked ~ label i:after{-webkit-transform:scale(1) !important;-moz-transform:scale(1) !important;-o-transform:scale(1) !important;transform:scale(1) !important}.pretty.outline-success input:checked+label i:before{color:#5cb85c}.pretty.outline-success input:checked+label i:after{border-color:#5cb85c}.pretty.toggle i.primary:before{color:#428bca !important}.pretty.toggle i.success:before{color:#5cb85c !important}.pretty.toggle i.info:before{color:#5bc0de !important}.pretty.toggle i.warning:before{color:#f0ad4e !important}.pretty.toggle i.danger:before{color:#d9534f !important}.pretty.info input:checked+label i:before{color:#fff}.pretty.info input:checked+label i:after{background-color:#5bc0de;border-color:#5bc0de}.pretty.info input[type='radio']:checked+label i.default:before{background-color:#5bc0de;color:transparent}.pretty.info input[type='radio']:checked+label i.default:after{background-color:initial;border-color:#5bc0de}.pretty.info.smooth input:checked ~ label i:after{-webkit-transform:scale(1) !important;-moz-transform:scale(1) !important;-o-transform:scale(1) !important;transform:scale(1) !important}.pretty.outline-info input:checked+label i:before{color:#5bc0de}.pretty.outline-info input:checked+label i:after{border-color:#5bc0de}.pretty.toggle i.primary:before{color:#428bca !important}.pretty.toggle i.success:before{color:#5cb85c !important}.pretty.toggle i.info:before{color:#5bc0de !important}.pretty.toggle i.warning:before{color:#f0ad4e !important}.pretty.toggle i.danger:before{color:#d9534f !important}.pretty.warning input:checked+label i:before{color:#fff}.pretty.warning input:checked+label i:after{background-color:#f0ad4e;border-color:#f0ad4e}.pretty.warning input[type='radio']:checked+label i.default:before{background-color:#f0ad4e;color:transparent}.pretty.warning input[type='radio']:checked+label i.default:after{background-color:initial;border-color:#f0ad4e}.pretty.warning.smooth input:checked ~ label i:after{-webkit-transform:scale(1) !important;-moz-transform:scale(1) !important;-o-transform:scale(1) !important;transform:scale(1) !important}.pretty.outline-warning input:checked+label i:before{color:#f0ad4e}.pretty.outline-warning input:checked+label i:after{border-color:#f0ad4e}.pretty.toggle i.primary:before{color:#428bca !important}.pretty.toggle i.success:before{color:#5cb85c !important}.pretty.toggle i.info:before{color:#5bc0de !important}.pretty.toggle i.warning:before{color:#f0ad4e !important}.pretty.toggle i.danger:before{color:#d9534f !important}.pretty.danger input:checked+label i:before{color:#fff}.pretty.danger input:checked+label i:after{background-color:#d9534f;border-color:#d9534f}.pretty.danger input[type='radio']:checked+label i.default:before{background-color:#d9534f;color:transparent}.pretty.danger input[type='radio']:checked+label i.default:after{background-color:initial;border-color:#d9534f}.pretty.danger.smooth input:checked ~ label i:after{-webkit-transform:scale(1) !important;-moz-transform:scale(1) !important;-o-transform:scale(1) !important;transform:scale(1) !important}.pretty.outline-danger input:checked+label i:before{color:#d9534f}.pretty.outline-danger input:checked+label i:after{border-color:#d9534f}.pretty.toggle i.primary:before{color:#428bca !important}.pretty.toggle i.success:before{color:#5cb85c !important}.pretty.toggle i.info:before{color:#5bc0de !important}.pretty.toggle i.warning:before{color:#f0ad4e !important}.pretty.toggle i.danger:before{color:#d9534f !important}.pretty.toggle>input[type='checkbox']+label>i:before,.pretty.toggle>input[type='radio']+label>i:before{color:inherit}.pretty.toggle>input[type='checkbox']+label+label,.pretty.toggle>input[type='radio']+label+label{display:none}.pretty.toggle>input[type='checkbox']:checked+label,.pretty.toggle>input[type='radio']:checked+label{display:none}.pretty.toggle>input[type='checkbox']:checked+label+label,.pretty.toggle>input[type='radio']:checked+label+label{display:inline-block}.pretty.toggle>input[type='checkbox']:checked+label+label>i:before,.pretty.toggle>input[type='radio']:checked+label+label>i:before{color:inherit}.zmdi{padding-left:2px !important}i[class*="ion-"]{padding-left:2px}.pretty.smooth i:before{-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease;-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}.pretty.smooth i:after{-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease}.pretty.smooth>input[type='checkbox']:checked ~ label>i:before,.pretty.smooth>input[type='radio']:checked ~ label>i:before{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}.pretty.smooth>input[type='checkbox']:checked ~ label>i:after,.pretty.smooth>input[type='radio']:checked ~ label>i:after{-webkit-transform:scale(0);-moz-transform:scale(0);-o-transform:scale(0);transform:scale(0)}.pretty.smooth>input[type='radio']:checked ~ label>i.default:before{-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8)}.pretty.smooth>input[type='radio']:checked ~ label>i.default:after{-webkit-transform:scale(1);-moz-transform:scale(1);-o-transform:scale(1);transform:scale(1)}.pretty.smooth.toggle i:before{-webkit-transform:none;-moz-transform:none;-o-transform:none;transform:none}.pretty.smooth.toggle>input[type='checkbox']:checked ~ label>i:before,.pretty.smooth.toggle>input[type='radio']:checked ~ label>i:before{-webkit-transform:none;-moz-transform:none;-o-transform:none;transform:none}.pretty.smooth.toggle>input[type='checkbox']:checked ~ label>i:after,.pretty.smooth.toggle>input[type='radio']:checked ~ label>i:after{-webkit-transform:none;-moz-transform:none;-o-transform:none;transform:none} diff --git a/src/scss/decorators/_animation.scss b/src/scss/decorators/_animation.scss index 8ae9ebc..6b41249 100644 --- a/src/scss/decorators/_animation.scss +++ b/src/scss/decorators/_animation.scss @@ -17,6 +17,14 @@ @include prefixer(transform,scale(0)); } } + &>input[type='radio']:checked~label>i.default{ + &:before{ + @include prefixer(transform,scale(0.8)); + } + &:after{ + @include prefixer(transform,scale(1)); + } + } } .#{$pretty-class-name}.smooth.toggle{ i{