Skip to content

Commit d22428d

Browse files
dariusrosendahldariusrosendahl
authored
Merge pull request #26 from CastleCSS/feature/#7_Specific_utility_spacing_classes_do_not_overwrite_general_spacing_classes
Moved shorthands so they are declared before the longhands
2 parents 2492034 + 1760005 commit d22428d

File tree

1 file changed

+67
-63
lines changed

1 file changed

+67
-63
lines changed

‎sass/base/utility_spacers.scss‎

Lines changed: 67 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -1,52 +1,54 @@
11
/* Padding */
22

33
.p { padding: $padding-default; }
4-
.pt { padding-top: $padding-default; }
5-
.pb { padding-bottom: $padding-default; }
6-
.pl { padding-left: $padding-default; }
7-
.pr { padding-right: $padding-default; }
8-
94
.p-2x { padding: $padding-default*2; }
10-
.pt-2x { padding-top: $padding-default*2; }
11-
.pb-2x { padding-bottom: $padding-default*2; }
12-
.pl-2x { padding-left: $padding-default*2; }
13-
.pr-2x { padding-right: $padding-default*2; }
14-
155
.p-3x { padding: $padding-default*3; }
16-
.pt-3x { padding-top: $padding-default*3; }
17-
.pb-3x { padding-bottom: $padding-default*3; }
18-
.pl-3x { padding-left: $padding-default*3; }
19-
.pr-3x { padding-right: $padding-default*3; }
20-
216
.p-0 { padding: 0; }
7+
8+
.pt { padding-top: $padding-default; }
9+
.pt-2x { padding-top: $padding-default*2; }
10+
.pt-3x { padding-top: $padding-default* 3; }
2211
.pt-0 { padding-top: 0; }
12+
13+
.pb { padding-bottom: $padding-default; }
14+
.pb-2x { padding-bottom: $padding-default*2; }
15+
.pb-3x { padding-bottom: $padding-default* 3; }
2316
.pb-0 { padding-bottom: 0; }
17+
18+
.pl { padding-left: $padding-default; }
19+
.pl-2x { padding-left: $padding-default*2; }
20+
.pl-3x { padding-left: $padding-default* 3; }
2421
.pl-0 { padding-left: 0; }
22+
23+
.pr { padding-right: $padding-default; }
24+
.pr-2x { padding-right: $padding-default*2; }
25+
.pr-3x { padding-right: $padding-default* 3; }
2526
.pr-0 { padding-right: 0; }
2627

2728
/* Margin */
2829
.m { margin: $margin-default; }
29-
.mt { margin-top: $margin-default; }
30-
.mb { margin-bottom: $margin-default; }
31-
.ml { margin-left: $margin-default; }
32-
.mr { margin-right: $margin-default; }
33-
3430
.m-2x { margin: $margin-default*2; }
35-
.mt-2x { margin-top: $margin-default*2; }
36-
.mb-2x { margin-bottom: $margin-default*2; }
37-
.ml-2x { margin-left: $margin-default*2; }
38-
.mr-2x { margin-right: $margin-default*2; }
39-
4031
.m-3x { margin: $margin-default*3; }
41-
.mt-3x { margin-top: $margin-default*3; }
42-
.mb-3x { margin-bottom: $margin-default*3; }
43-
.ml-3x { margin-left: $margin-default*3; }
44-
.mr-3x { margin-right: $margin-default*3; }
45-
4632
.m-0 { margin: 0; }
33+
34+
.mt { margin-top: $margin-default; }
35+
.mt-2x { margin-top: $margin-default*2; }
36+
.mt-3x { margin-top: $margin-default*3; }
4737
.mt-0 { margin-top: 0; }
38+
39+
.mb { margin-bottom: $margin-default; }
40+
.mb-2x { margin-bottom: $margin-default*2; }
41+
.mb-3x { margin-bottom: $margin-default*3; }
4842
.mb-0 { margin-bottom: 0; }
43+
44+
.ml { margin-left: $margin-default; }
45+
.ml-2x { margin-left: $margin-default*2; }
46+
.ml-3x { margin-left: $margin-default*3; }
4947
.ml-0 { margin-left: 0; }
48+
49+
.mr { margin-right: $margin-default; }
50+
.mr-2x { margin-right: $margin-default*2; }
51+
.mr-3x { margin-right: $margin-default*3; }
5052
.mr-0 { margin-right: 0; }
5153

5254
@for $b from 1 through $amount-breakpoints {
@@ -55,53 +57,55 @@
5557
@media only screen and (min-width: $breakpoint) {
5658

5759
/* Padding */
58-
.p-b#{$b} { padding: $padding-default; }
59-
.pt-b#{$b} { padding-top: $padding-default; }
60-
.pb-b#{$b} { padding-bottom: $padding-default; }
61-
.pl-b#{$b} { padding-left: $padding-default; }
62-
.pr-b#{$b} { padding-right: $padding-default; }
63-
60+
.p-b#{$b} { padding: $padding-default; }
6461
.p-b#{$b}-2x { padding: $padding-default*2; }
65-
.pt-b#{$b}-2x { padding-top: $padding-default*2; }
66-
.pb-b#{$b}-2x { padding-bottom: $padding-default*2; }
67-
.pl-b#{$b}-2x { padding-left: $padding-default*2; }
68-
.pr-b#{$b}-2x { padding-right: $padding-default*2; }
69-
70-
.p-b#{$b}-3x { padding: $padding-default*3; }
71-
.pt-b#{$b}-3x { padding-top: $padding-default*3; }
72-
.pb-b#{$b}-3x { padding-bottom: $padding-default*3; }
73-
.pl-b#{$b}-3x { padding-left: $padding-default*3; }
74-
.pr-b#{$b}-3x { padding-right: $padding-default*3; }
75-
62+
.p-b#{$b}-3x { padding: $padding-default*3; }
7663
.p-b#{$b}-0 { padding: 0; }
64+
65+
.pt-b#{$b} { padding-top: $padding-default; }
66+
.pt-b#{$b}-2x { padding-top: $padding-default*2; }
67+
.pt-b#{$b}-3x { padding-top: $padding-default*3; }
7768
.pt-b#{$b}-0 { padding-top: 0; }
69+
70+
.pb-b#{$b} { padding-bottom: $padding-default; }
71+
.pb-b#{$b}-2x { padding-bottom: $padding-default*2; }
72+
.pb-b#{$b}-3x { padding-bottom: $padding-default*3; }
7873
.pb-b#{$b}-0 { padding-bottom: 0; }
74+
75+
.pl-b#{$b} { padding-left: $padding-default; }
76+
.pl-b#{$b}-2x { padding-left: $padding-default*2; }
77+
.pl-b#{$b}-3x { padding-left: $padding-default*3; }
7978
.pl-b#{$b}-0 { padding-left: 0; }
79+
80+
.pr-b#{$b} { padding-right: $padding-default; }
81+
.pr-b#{$b}-2x { padding-right: $padding-default*2; }
82+
.pr-b#{$b}-3x { padding-right: $padding-default*3; }
8083
.pr-b#{$b}-0 { padding-right: 0; }
8184

8285
/* Margin */
83-
.m-b#{$b} { margin: $margin-default; }
84-
.mt-b#{$b} { margin-top: $margin-default; }
85-
.mb-b#{$b} { margin-bottom: $margin-default; }
86-
.ml-b#{$b} { margin-left: $margin-default; }
87-
.mr-b#{$b} { margin-right: $margin-default; }
88-
86+
.m-b#{$b} { margin: $margin-default; }
8987
.m-b#{$b}-2x { margin: $margin-default*2; }
90-
.mt-b#{$b}-2x { margin-top: $margin-default*2; }
91-
.mb-b#{$b}-2x { margin-bottom: $margin-default*2; }
92-
.ml-b#{$b}-2x { margin-left: $margin-default*2; }
93-
.mr-b#{$b}-2x { margin-right: $margin-default*2; }
94-
9588
.m-b#{$b}-3x { margin: $margin-default*3; }
96-
.mt-b#{$b}-3x { margin-top: $margin-default*3; }
97-
.mb-b#{$b}-3x { margin-bottom: $margin-default*3; }
98-
.ml-b#{$b}-3x { margin-left: $margin-default*3; }
99-
.mr-b#{$b}-3x { margin-right: $margin-default*3; }
100-
10189
.m-b#{$b}-0 { margin: 0; }
90+
91+
.mt-b#{$b} { margin-top: $margin-default; }
92+
.mt-b#{$b}-2x { margin-top: $margin-default*2; }
93+
.mt-b#{$b}-3x { margin-top: $margin-default*3; }
10294
.mt-b#{$b}-0 { margin-top: 0; }
95+
96+
.mb-b#{$b} { margin-bottom: $margin-default; }
97+
.mb-b#{$b}-2x { margin-bottom: $margin-default*2; }
98+
.mb-b#{$b}-3x { margin-bottom: $margin-default*3; }
10399
.mb-b#{$b}-0 { margin-bottom: 0; }
100+
101+
.ml-b#{$b} { margin-left: $margin-default; }
102+
.ml-b#{$b}-2x { margin-left: $margin-default*2; }
103+
.ml-b#{$b}-3x { margin-left: $margin-default*3; }
104104
.ml-b#{$b}-0 { margin-left: 0; }
105+
106+
.mr-b#{$b} { margin-right: $margin-default; }
107+
.mr-b#{$b}-2x { margin-right: $margin-default*2; }
108+
.mr-b#{$b}-3x { margin-right: $margin-default*3; }
105109
.mr-b#{$b}-0 { margin-right: 0; }
106110
}
107111
}

0 commit comments

Comments
 (0)