Skip to content

Commit 6a1c157

Browse files
lokesh-coderlokesh-coder
committed
Refactored: scss folder names
1 parent 75d7549 commit 6a1c157

File tree

14 files changed

+309
-2
lines changed

14 files changed

+309
-2
lines changed

‎bower.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "pretty-checkbox",
3-
"version": "1.0.1",
3+
"version": "2.0.0",
44
"description": "Scalable css3 pretty checkbox and radio buttons",
55
"license": "MIT",
66
"main": "src/pretty.css",

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "pretty-checkbox",
3-
"version": "1.0.1",
3+
"version": "2.0.0",
44
"description": "Scalable css3 pretty checkbox and radio buttons with custom font icon library",
55
"main": "src/pretty.min.css",
66
"dependencies": {},

‎src/scss/decorators/_animation.scss

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
.#{$pretty-class-name}.smooth{
2+
i{
3+
&:before{
4+
@include prefixer(transition,all 0.5s ease);
5+
@include prefixer(transform,scale(0));
6+
}
7+
&:after{
8+
@include prefixer(transition,all 0.5s ease);
9+
}
10+
}
11+
&>input[type='checkbox']:checked~label>i,
12+
&>input[type='radio']:checked~label>i{
13+
&:before{
14+
@include prefixer(transform,scale(1));
15+
}
16+
&:after{
17+
@include prefixer(transform,scale(0));
18+
}
19+
}
20+
}
21+
.#{$pretty-class-name}.smooth.toggle{
22+
i{
23+
&:before{
24+
@include prefixer(transform,none);
25+
}
26+
}
27+
&>input[type='checkbox']:checked~label>i,
28+
&>input[type='radio']:checked~label>i{
29+
&:before{
30+
@include prefixer(transform,none);
31+
}
32+
&:after{
33+
@include prefixer(transform,none);
34+
}
35+
}
36+
}

‎src/scss/decorators/_circle.scss

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
.#{$pretty-class-name}.circle{
2+
label i:after{
3+
border-radius: 100px;
4+
}
5+
label i.default:before{
6+
border-radius: 100px !important;
7+
}
8+
}

‎src/scss/decorators/_color.scss

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
$outline-colors:primary outline-primary #428bca , success outline-success #5cb85c,info outline-info #5bc0de,warning outline-warning #f0ad4e,danger outline-danger #d9534f;
2+
3+
@each $color in $outline-colors{
4+
.#{$pretty-class-name}.#{nth($color,1)}{
5+
input:checked+ label i{
6+
&:before{
7+
color:#fff;
8+
}
9+
&:after{
10+
background-color:nth($color,3);
11+
border-color:nth($color,3)
12+
}
13+
}
14+
input[type='radio']:checked+ label i.default{
15+
&:before{
16+
background-color:nth($color,3);
17+
color:transparent;
18+
}
19+
&:after{
20+
background-color: initial;
21+
border-color:nth($color,3)
22+
}
23+
}
24+
&.smooth{
25+
input:checked ~ label i:after{
26+
@include prefixer(transform,scale(1) !important);
27+
}
28+
}
29+
}
30+
.#{$pretty-class-name}.#{nth($color,2)}{
31+
input:checked+label i{
32+
&:before{
33+
color:nth($color,3)
34+
}
35+
&:after{
36+
border-color:nth($color,3);
37+
}
38+
}
39+
}
40+
.#{$pretty-class-name}.toggle{
41+
@each $subcolor in $outline-colors{
42+
i.#{nth($subcolor,1)}{
43+
&:before{
44+
color:nth($subcolor,3) !important;
45+
}
46+
}
47+
}
48+
49+
}
50+
}

‎src/scss/decorators/_core.scss

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
.#{$pretty-class-name}{
2+
position: relative;
3+
line-height: 1;
4+
margin-bottom: 5px;
5+
}
6+
7+
8+
.#{$pretty-class-name}{
9+
label{
10+
font-weight: normal;
11+
}
12+
&>input[type='checkbox'],
13+
&>input[type='radio']{
14+
position: absolute;
15+
display: block;
16+
left: 0;
17+
top: 0;
18+
height: 100%;
19+
width: 100%;
20+
opacity: 0;
21+
margin: 0;
22+
cursor: pointer;
23+
z-index: 99999999;
24+
}
25+
i{
26+
&:before{
27+
margin-right: 5px;
28+
vertical-align: bottom;
29+
display: inline-block ;
30+
color:transparent;
31+
position: relative;
32+
z-index: 999;
33+
left: -1px;
34+
}
35+
&:after{
36+
content: '\0000';
37+
border-radius: $pretty-border-radius;
38+
border: 1px solid #aaa;
39+
position: absolute;
40+
color: transparent;
41+
left: -1px;
42+
top: -1px;
43+
}
44+
}
45+
&>input[type='checkbox']:checked+label>i,
46+
&>input[type='radio']:checked+label>i{
47+
&:before{
48+
color:inherit;
49+
}
50+
&:after{}
51+
}
52+
&>input[type='radio']+label>i.default{
53+
&:before{
54+
content: '\0000';
55+
border-radius: 2px;
56+
@include prefixer(transform,scale(0.8));
57+
color: transparent;
58+
background: transparent;
59+
left: 0;
60+
}
61+
&:after{}
62+
}
63+
&>input[type='radio']:checked+label>i.default{
64+
&:before{
65+
background: #aaa;
66+
}
67+
&:after{}
68+
}
69+
&>input[type='checkbox'][disabled],
70+
&>input[type='radio'][disabled]{
71+
cursor: not-allowed;
72+
opacity: 0;
73+
&+label{
74+
opacity: 0.5;
75+
cursor: not-allowed;
76+
}
77+
}
78+
}

‎src/scss/decorators/_index.scss

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
@import 'core';
2+
@import 'inline';
3+
@import 'plain';
4+
@import 'circle';
5+
@import 'color';
6+
@import 'toggle';
7+
@import 'override';
8+
@import 'animation';

‎src/scss/decorators/_inline.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
.#{$pretty-class-name}.inline{
2+
display: inline-block;
3+
margin-right: 20px;
4+
}

‎src/scss/decorators/_override.scss

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
.zmdi{
2+
padding-left: 2px !important;
3+
}
4+
i[class*="ion-"]{
5+
padding-left: 2px;
6+
}

‎src/scss/decorators/_plain.scss

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
.#{$pretty-class-name}.plain{
2+
&>input[type='checkbox']+label,
3+
&>input[type='radio']+label{
4+
&>i:after{
5+
// border-color:transparent;
6+
}
7+
}
8+
&>input[type='checkbox']:checked+label,
9+
&>input[type='radio']:checked+label{
10+
&>i:after{
11+
border-color:transparent;
12+
}
13+
}
14+
&>input[type='checkbox']+label+label,
15+
&>input[type='radio']+label+label{
16+
&>i:after{
17+
border-color:transparent;
18+
}
19+
}
20+
&>input[type='checkbox']:checked+label+label,
21+
&>input[type='radio']:checked+label+label{
22+
&>i:after{
23+
border-color:transparent;
24+
}
25+
}
26+
}
27+
28+
.#{$pretty-class-name}.plain.toggle{
29+
&>input[type='checkbox']+label,
30+
&>input[type='radio']+label{
31+
&>i:after{
32+
border-color:transparent;
33+
}
34+
}
35+
}

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy