helio 0.0.0.7 → 0.0.0.8
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/assets/stylesheets/_helio.scss +5 -0
- data/assets/stylesheets/helio/_borders.scss +304 -0
- data/assets/stylesheets/helio/_colors.scss +75 -6
- data/assets/stylesheets/helio/_fonts.scss +39 -6
- data/assets/stylesheets/helio/_mixins.scss +1 -0
- data/assets/stylesheets/helio/_spaces.scss +148 -34
- data/assets/stylesheets/helio/_utilities.scss +153 -0
- data/assets/stylesheets/helio/_variables.scss +95 -67
- data/assets/stylesheets/helio/mixins/generators.scss +1 -0
- data/assets/stylesheets/helio/normalize.scss +19 -0
- data/lib/helio/version.rb +1 -1
- metadata +7 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 6d1c12faaab33a00f4983e2399f9577cdec18650
|
|
4
|
+
data.tar.gz: 5b5b11b2b3f57cdf1ed9646bd66329d13cee8cac
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 543db73e29bda6a3ffad1960adacf4d66e02fc67618c5b82440afaa84df298871a69196d06e577e75f639aba625b7abe3767131f1b16cf0ae9cf72faefa0226f
|
|
7
|
+
data.tar.gz: af4df72c2adeb26b4eb3629a6fb05f9043d5e53c3f2d0b7933d8c4b6db578c78ecc0509a2e728d2e95413257ad06da2149e4e9f9d7178fd73975764ac4aa5a4e
|
|
@@ -0,0 +1,304 @@
|
|
|
1
|
+
@mixin border-widths($name, $value) {
|
|
2
|
+
.bwt-#{$name}, .bwt-xs-#{$name},
|
|
3
|
+
.bwv-#{$name}, .bwv-xs-#{$name},
|
|
4
|
+
.bwa-#{$name}, .bwa-xs-#{$name},
|
|
5
|
+
.bwt-#{$name}-hover:hover, .bwt-xs-#{$name}-hover:hover,
|
|
6
|
+
.bwv-#{$name}-hover:hover, .bwv-xs-#{$name}-hover:hover,
|
|
7
|
+
.bwa-#{$name}-hover:hover, .bwa-xs-#{$name}-hover:hover,
|
|
8
|
+
.active .bwt-#{$name}-active, .active .bwt-xs-#{$name}-active,
|
|
9
|
+
.active .bwv-#{$name}-active, .active .bwv-xs-#{$name}-active,
|
|
10
|
+
.active .bwa-#{$name}-active, .active .bwa-xs-#{$name}-active,
|
|
11
|
+
.bwt-#{$name}-plus + .bwt-#{$name}-plus, .bwt-xs-#{$name}-plus + .bwt-xs-#{$name}-plus {
|
|
12
|
+
border-width-top: $value;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.bwl-#{$name}, .bwl-xs-#{$name},
|
|
16
|
+
.bwh-#{$name}, .bwh-xs-#{$name},
|
|
17
|
+
.bwa-#{$name}, .bwa-xs-#{$name},
|
|
18
|
+
.bwl-#{$name}-hover:hover, .bwl-xs-#{$name}-hover:hover,
|
|
19
|
+
.bwh-#{$name}-hover:hover, .bwh-xs-#{$name}-hover:hover,
|
|
20
|
+
.bwa-#{$name}-hover:hover, .bwa-xs-#{$name}-hover:hover,
|
|
21
|
+
.active .bwl-#{$name}-active, .active .bwl-xs-#{$name}-active,
|
|
22
|
+
.active .bwh-#{$name}-active, .active .bwh-xs-#{$name}-active,
|
|
23
|
+
.active .bwa-#{$name}-active, .active .bwa-xs-#{$name}-active,
|
|
24
|
+
.bwl-#{$name}-plus + .bwl-#{$name}-plus, .bwl-xs-#{$name}-plus + .bwl-xs-#{$name}-plus {
|
|
25
|
+
border-width-left: $value;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.bwb-#{$name}, .bwb-xs-#{$name},
|
|
29
|
+
.bwv-#{$name}, .bwv-xs-#{$name},
|
|
30
|
+
.bwa-#{$name}, .bwa-xs-#{$name},
|
|
31
|
+
.bwb-#{$name}-hover:hover, .bwb-xs-#{$name}-hover:hover,
|
|
32
|
+
.bwv-#{$name}-hover:hover, .bwv-xs-#{$name}-hover:hover,
|
|
33
|
+
.bwa-#{$name}-hover:hover, .bwa-xs-#{$name}-hover:hover,
|
|
34
|
+
.active .bwb-#{$name}-active, .active .bwb-xs-#{$name}-active,
|
|
35
|
+
.active .bwv-#{$name}-active, .active .bwv-xs-#{$name}-active,
|
|
36
|
+
.active .bwa-#{$name}-active, .active .bwa-xs-#{$name}-active {
|
|
37
|
+
border-width-bottom: $value;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.bwr-#{$name}, .bwr-xs-#{$name},
|
|
41
|
+
.bwh-#{$name}, .bwh-xs-#{$name},
|
|
42
|
+
.bwa-#{$name}, .bwa-xs-#{$name},
|
|
43
|
+
.bwr-#{$name}-hover:hover, .bwr-xs-#{$name}-hover:hover,
|
|
44
|
+
.bwh-#{$name}-hover:hover, .bwh-xs-#{$name}-hover:hover,
|
|
45
|
+
.bwa-#{$name}-hover:hover, .bwa-xs-#{$name}-hover:hover,
|
|
46
|
+
.active .bwr-#{$name}-active, .active .bwr-xs-#{$name}-active,
|
|
47
|
+
.active .bwh-#{$name}-active, .active .bwh-xs-#{$name}-active,
|
|
48
|
+
.active .bwa-#{$name}-active, .active .bwa-xs-#{$name}-active,
|
|
49
|
+
.bwr-#{$name}-plus + .bwr-#{$name}-plus, .bwr-xs-#{$name}-plus + .bwr-xs-#{$name}-plus {
|
|
50
|
+
border-width-right: $value;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
@media (min-width: $screen-sm-min) {
|
|
54
|
+
.bwt-sm-#{$name},
|
|
55
|
+
.bwv-sm-#{$name},
|
|
56
|
+
.bwa-sm-#{$name},
|
|
57
|
+
.bwt-sm-#{$name}-hover:hover,
|
|
58
|
+
.bwv-sm-#{$name}-hover:hover,
|
|
59
|
+
.bwa-sm-#{$name}-hover:hover,
|
|
60
|
+
.active .bwt-sm-#{$name}-active,
|
|
61
|
+
.active .bwv-sm-#{$name}-active,
|
|
62
|
+
.active .bwa-sm-#{$name}-active,
|
|
63
|
+
.bwt-sm-#{$name}-plus + .bwt-sm-#{$name}-plus {
|
|
64
|
+
border-width-top: $value;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
.bwl-sm-#{$name},
|
|
68
|
+
.bwh-sm-#{$name},
|
|
69
|
+
.bwa-sm-#{$name},
|
|
70
|
+
.bwl-sm-#{$name}-hover:hover,
|
|
71
|
+
.bwh-sm-#{$name}-hover:hover,
|
|
72
|
+
.bwa-sm-#{$name}-hover:hover,
|
|
73
|
+
.active .bwl-sm-#{$name}-active,
|
|
74
|
+
.active .bwh-sm-#{$name}-active,
|
|
75
|
+
.active .bwa-sm-#{$name}-active,
|
|
76
|
+
.bwl-sm-#{$name}-plus + .bwl-sm-#{$name}-plus {
|
|
77
|
+
border-width-left: $value;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.bwb-sm-#{$name},
|
|
81
|
+
.bwv-sm-#{$name},
|
|
82
|
+
.bwa-sm-#{$name},
|
|
83
|
+
.bwb-sm-#{$name}-hover:hover,
|
|
84
|
+
.bwv-sm-#{$name}-hover:hover,
|
|
85
|
+
.bwa-sm-#{$name}-hover:hover,
|
|
86
|
+
.active .bwb-sm-#{$name}-active,
|
|
87
|
+
.active .bwv-sm-#{$name}-active,
|
|
88
|
+
.active .bwa-sm-#{$name}-active {
|
|
89
|
+
border-width-bottom: $value;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
.bwr-sm-#{$name},
|
|
93
|
+
.bwh-sm-#{$name},
|
|
94
|
+
.bwa-sm-#{$name},
|
|
95
|
+
.bwr-sm-#{$name}-hover:hover,
|
|
96
|
+
.bwh-sm-#{$name}-hover:hover,
|
|
97
|
+
.bwa-sm-#{$name}-hover:hover,
|
|
98
|
+
.active .bwr-sm-#{$name}-active,
|
|
99
|
+
.active .bwh-sm-#{$name}-active,
|
|
100
|
+
.active .bwa-sm-#{$name}-active,
|
|
101
|
+
.bwr-sm-#{$name}-plus + .bwr-sm-#{$name}-plus {
|
|
102
|
+
border-width-right: $value;
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
@media (min-width: $screen-md-min) {
|
|
107
|
+
.bwt-md-#{$name},
|
|
108
|
+
.bwv-md-#{$name},
|
|
109
|
+
.bwa-md-#{$name},
|
|
110
|
+
.bwt-md-#{$name}-hover:hover,
|
|
111
|
+
.bwv-md-#{$name}-hover:hover,
|
|
112
|
+
.bwa-md-#{$name}-hover:hover,
|
|
113
|
+
.active .bwt-md-#{$name}-active,
|
|
114
|
+
.active .bwv-md-#{$name}-active,
|
|
115
|
+
.active .bwa-md-#{$name}-active,
|
|
116
|
+
.bwt-md-#{$name}-plus + .bwt-md-#{$name}-plus {
|
|
117
|
+
border-width-top: $value;
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
.bwl-md-#{$name},
|
|
121
|
+
.bwh-md-#{$name},
|
|
122
|
+
.bwa-md-#{$name},
|
|
123
|
+
.bwl-md-#{$name}-hover:hover,
|
|
124
|
+
.bwh-md-#{$name}-hover:hover,
|
|
125
|
+
.bwa-md-#{$name}-hover:hover,
|
|
126
|
+
.active .bwl-md-#{$name}-active,
|
|
127
|
+
.active .bwh-md-#{$name}-active,
|
|
128
|
+
.active .bwa-md-#{$name}-active,
|
|
129
|
+
.bwl-md-#{$name}-plus + .bwl-md-#{$name}-plus {
|
|
130
|
+
border-width-left: $value;
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
.bwb-md-#{$name},
|
|
134
|
+
.bwv-md-#{$name},
|
|
135
|
+
.bwa-md-#{$name},
|
|
136
|
+
.bwb-md-#{$name}-hover:hover,
|
|
137
|
+
.bwv-md-#{$name}-hover:hover,
|
|
138
|
+
.bwa-md-#{$name}-hover:hover,
|
|
139
|
+
.active .bwb-md-#{$name}-active,
|
|
140
|
+
.active .bwv-md-#{$name}-active,
|
|
141
|
+
.active .bwa-md-#{$name}-active {
|
|
142
|
+
border-width-bottom: $value;
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
.bwr-md-#{$name},
|
|
146
|
+
.bwh-md-#{$name},
|
|
147
|
+
.bwa-md-#{$name},
|
|
148
|
+
.bwr-md-#{$name}-hover:hover,
|
|
149
|
+
.bwh-md-#{$name}-hover:hover,
|
|
150
|
+
.bwa-md-#{$name}-hover:hover,
|
|
151
|
+
.active .bwr-md-#{$name}-active,
|
|
152
|
+
.active .bwh-md-#{$name}-active,
|
|
153
|
+
.active .bwa-md-#{$name}-active,
|
|
154
|
+
.bwr-md-#{$name}-plus + .bwr-md-#{$name}-plus {
|
|
155
|
+
border-width-right: $value;
|
|
156
|
+
}
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
@media (min-width: $screen-lg-min) {
|
|
160
|
+
.bwt-lg-#{$name},
|
|
161
|
+
.bwv-lg-#{$name},
|
|
162
|
+
.bwa-lg-#{$name},
|
|
163
|
+
.bwt-lg-#{$name}-hover:hover,
|
|
164
|
+
.bwv-lg-#{$name}-hover:hover,
|
|
165
|
+
.bwa-lg-#{$name}-hover:hover,
|
|
166
|
+
.active .bwt-lg-#{$name}-active,
|
|
167
|
+
.active .bwv-lg-#{$name}-active,
|
|
168
|
+
.active .bwa-lg-#{$name}-active,
|
|
169
|
+
.bwt-lg-#{$name}-plus + .bwt-lg-#{$name}-plus {
|
|
170
|
+
border-width-top: $value;
|
|
171
|
+
}
|
|
172
|
+
|
|
173
|
+
.bwl-lg-#{$name},
|
|
174
|
+
.bwh-lg-#{$name},
|
|
175
|
+
.bwa-lg-#{$name},
|
|
176
|
+
.bwl-lg-#{$name}-hover:hover,
|
|
177
|
+
.bwh-lg-#{$name}-hover:hover,
|
|
178
|
+
.bwa-lg-#{$name}-hover:hover,
|
|
179
|
+
.active .bwl-lg-#{$name}-active,
|
|
180
|
+
.active .bwh-lg-#{$name}-active,
|
|
181
|
+
.active .bwa-lg-#{$name}-active,
|
|
182
|
+
.bwl-lg-#{$name}-plus + .bwl-lg-#{$name}-plus {
|
|
183
|
+
border-width-left: $value;
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
.bwb-lg-#{$name},
|
|
187
|
+
.bwv-lg-#{$name},
|
|
188
|
+
.bwa-lg-#{$name},
|
|
189
|
+
.bwb-lg-#{$name}-hover:hover,
|
|
190
|
+
.bwv-lg-#{$name}-hover:hover,
|
|
191
|
+
.bwa-lg-#{$name}-hover:hover,
|
|
192
|
+
.active .bwb-lg-#{$name}-active,
|
|
193
|
+
.active .bwv-lg-#{$name}-active,
|
|
194
|
+
.active .bwa-lg-#{$name}-active {
|
|
195
|
+
border-width-bottom: $value;
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
.bwr-lg-#{$name},
|
|
199
|
+
.bwh-lg-#{$name},
|
|
200
|
+
.bwa-lg-#{$name},
|
|
201
|
+
.bwr-lg-#{$name}-hover:hover,
|
|
202
|
+
.bwh-lg-#{$name}-hover:hover,
|
|
203
|
+
.bwa-lg-#{$name}-hover:hover,
|
|
204
|
+
.active .bwr-lg-#{$name}-active,
|
|
205
|
+
.active .bwh-lg-#{$name}-active,
|
|
206
|
+
.active .bwa-lg-#{$name}-active,
|
|
207
|
+
.bwr-lg-#{$name}-plus + .bwr-lg-#{$name}-plus {
|
|
208
|
+
border-width-right: $value;
|
|
209
|
+
}
|
|
210
|
+
}
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
@mixin border-radiuses($name, $value) {
|
|
214
|
+
.brtl-#{$name},
|
|
215
|
+
.brt-#{$name},
|
|
216
|
+
.brl-#{$name},
|
|
217
|
+
.bra-#{$name},
|
|
218
|
+
.brtl-#{$name}-hover:hover,
|
|
219
|
+
.brt-#{$name}-hover:hover,
|
|
220
|
+
.brl-#{$name}-hover:hover,
|
|
221
|
+
.bra-#{$name}-hover:hover,
|
|
222
|
+
.active .brtl-#{$name}-active,
|
|
223
|
+
.active .brt-#{$name}-active,
|
|
224
|
+
.active .brl-#{$name}-active,
|
|
225
|
+
.active .bra-#{$name}-active {
|
|
226
|
+
-webkit-border-top-left-radius: $value;
|
|
227
|
+
-moz-border-radius-topleft: $value;
|
|
228
|
+
border-top-left-radius: $value;
|
|
229
|
+
}
|
|
230
|
+
.brtr-#{$name},
|
|
231
|
+
.brt-#{$name},
|
|
232
|
+
.brr-#{$name},
|
|
233
|
+
.bra-#{$name},
|
|
234
|
+
.brtr-#{$name}-hover:hover,
|
|
235
|
+
.brt-#{$name}-hover:hover,
|
|
236
|
+
.brr-#{$name}-hover:hover,
|
|
237
|
+
.bra-#{$name}-hover:hover,
|
|
238
|
+
.active .brtr-#{$name}-active,
|
|
239
|
+
.active .brt-#{$name}-active,
|
|
240
|
+
.active .brr-#{$name}-active,
|
|
241
|
+
.active .bra-#{$name}-active {
|
|
242
|
+
-webkit-border-top-right-radius: $value;
|
|
243
|
+
-moz-border-radius-topright: $value;
|
|
244
|
+
border-top-right-radius: $value;
|
|
245
|
+
}
|
|
246
|
+
.brbl-#{$name},
|
|
247
|
+
.brb-#{$name},
|
|
248
|
+
.brl-#{$name},
|
|
249
|
+
.bra-#{$name},
|
|
250
|
+
.brbl-#{$name}-hover:hover,
|
|
251
|
+
.brb-#{$name}-hover:hover,
|
|
252
|
+
.brl-#{$name}-hover:hover,
|
|
253
|
+
.bra-#{$name}-hover:hover,
|
|
254
|
+
.active .brbl-#{$name}-active,
|
|
255
|
+
.active .brb-#{$name}-active,
|
|
256
|
+
.active .brl-#{$name}-active,
|
|
257
|
+
.active .bra-#{$name}-active {
|
|
258
|
+
-webkit-border-bottom-left-radius: $value;
|
|
259
|
+
-moz-border-radius-bottomleft: $value;
|
|
260
|
+
border-bottom-left-radius: $value;
|
|
261
|
+
}
|
|
262
|
+
.brbr-#{$name},
|
|
263
|
+
.brb-#{$name},
|
|
264
|
+
.brr-#{$name},
|
|
265
|
+
.bra-#{$name},
|
|
266
|
+
.brbr-#{$name}-hover:hover,
|
|
267
|
+
.brb-#{$name}-hover:hover,
|
|
268
|
+
.brr-#{$name}-hover:hover,
|
|
269
|
+
.bra-#{$name}-hover:hover,
|
|
270
|
+
.active .brbr-#{$name}-active,
|
|
271
|
+
.active .brb-#{$name}-active,
|
|
272
|
+
.active .brr-#{$name}-active,
|
|
273
|
+
.active .bra-#{$name}-active {
|
|
274
|
+
-webkit-border-bottom-right-radius: $value;
|
|
275
|
+
-moz-border-radius-bottomright: $value;
|
|
276
|
+
border-bottom-right-radius: $value;
|
|
277
|
+
}
|
|
278
|
+
}
|
|
279
|
+
|
|
280
|
+
.bs-sld,
|
|
281
|
+
.bs-sld-hover:hover,
|
|
282
|
+
.active .bs-sld-active {
|
|
283
|
+
border-style: solid;
|
|
284
|
+
}
|
|
285
|
+
|
|
286
|
+
.bs-dtd,
|
|
287
|
+
.bs-dtd-hover:hover,
|
|
288
|
+
.active .bs-dtd-active {
|
|
289
|
+
border-style: dotted;
|
|
290
|
+
}
|
|
291
|
+
|
|
292
|
+
.bs-dsd,
|
|
293
|
+
.bs-dsd-hover:hover,
|
|
294
|
+
.active .bs-dsd-active {
|
|
295
|
+
border-style: dashed;
|
|
296
|
+
}
|
|
297
|
+
|
|
298
|
+
@include border-widths(0, 0px);
|
|
299
|
+
@for $border-width-index from 1 through length($helio-border-widths) {
|
|
300
|
+
$name: $border-width-index - 1;
|
|
301
|
+
$value: nth($helio-border-widths, $border-width-index);
|
|
302
|
+
|
|
303
|
+
@include border-widths(#{$name}, #{$value});
|
|
304
|
+
}
|
|
@@ -1,27 +1,96 @@
|
|
|
1
1
|
@mixin colors($name, $value) {
|
|
2
|
-
.c-#{$name}, .c-#{$name}
|
|
2
|
+
.c-#{$name}, .c-xs-#{$name},
|
|
3
|
+
.c-#{$name}-hover:hover, .c-xs-#{$name}-hover:hover,
|
|
4
|
+
.active .c-#{$name}-active, .active .c-xs-#{$name}-active {
|
|
3
5
|
color: $value;
|
|
4
6
|
}
|
|
5
7
|
|
|
6
|
-
.bg-#{$name}, .bg-#{$name}
|
|
8
|
+
.bg-#{$name}, .bg-xs-#{$name},
|
|
9
|
+
.bg-#{$name}-hover:hover, .bg-xs-#{$name}-hover:hover,
|
|
10
|
+
.active .bg-#{$name}-active, .active .bg-xs-#{$name}-active {
|
|
7
11
|
background-color: $value;
|
|
8
12
|
}
|
|
9
13
|
|
|
10
|
-
.bc-#{$name}, .bc-#{$name}
|
|
14
|
+
.bc-#{$name}, .bc-xs-#{$name},
|
|
15
|
+
.bc-#{$name}-hover:hover, .bc-xs-#{$name}-hover:hover,
|
|
16
|
+
.active .bc-#{$name}-active, .active .bc-xs-#{$name}-active {
|
|
11
17
|
border-color: $value;
|
|
12
18
|
}
|
|
19
|
+
|
|
20
|
+
@media (min-width: $screen-sm-min) {
|
|
21
|
+
.c-sm-#{$name},
|
|
22
|
+
.c-sm-#{$name}-hover:hover,
|
|
23
|
+
.active .c-sm-#{$name}-active {
|
|
24
|
+
color: $value;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.bg-sm-#{$name},
|
|
28
|
+
.bg-sm-#{$name}-hover:hover,
|
|
29
|
+
.active .bg-sm-#{$name}-active {
|
|
30
|
+
background-color: $value;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.bc-sm-#{$name},
|
|
34
|
+
.bc-sm-#{$name}-hover:hover,
|
|
35
|
+
.active .bc-sm-#{$name}-active {
|
|
36
|
+
border-color: $value;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
@media (min-width: $screen-md-min) {
|
|
41
|
+
.c-md-#{$name},
|
|
42
|
+
.c-md-#{$name}-hover:hover,
|
|
43
|
+
.active .c-md-#{$name}-active {
|
|
44
|
+
color: $value;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.bg-md-#{$name},
|
|
48
|
+
.bg-md-#{$name}-hover:hover,
|
|
49
|
+
.active .bg-md-#{$name}-active {
|
|
50
|
+
background-color: $value;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.bc-md-#{$name},
|
|
54
|
+
.bc-md-#{$name}-hover:hover,
|
|
55
|
+
.active .bc-md-#{$name}-active {
|
|
56
|
+
border-color: $value;
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
@media (min-width: $screen-lg-min) {
|
|
61
|
+
.c-lg-#{$name},
|
|
62
|
+
.c-lg-#{$name}-hover:hover,
|
|
63
|
+
.active .c-lg-#{$name}-active {
|
|
64
|
+
color: $value;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
.bg-lg-#{$name},
|
|
68
|
+
.bg-lg-#{$name}-hover:hover,
|
|
69
|
+
.active .bg-lg-#{$name}-active {
|
|
70
|
+
background-color: $value;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.bc-lg-#{$name},
|
|
74
|
+
.bc-lg-#{$name}-hover:hover,
|
|
75
|
+
.active .bc-lg-#{$name}-active {
|
|
76
|
+
border-color: $value;
|
|
77
|
+
}
|
|
78
|
+
}
|
|
13
79
|
}
|
|
14
80
|
|
|
15
81
|
@include colors(n, none);
|
|
16
82
|
|
|
17
83
|
@for $color-index from 1 through length($helio-shades) {
|
|
18
|
-
$color:
|
|
84
|
+
$color-name: $color-index - 1;
|
|
85
|
+
$color-value: nth($helio-shades, $color-index);
|
|
19
86
|
|
|
20
|
-
@include colors(#{$color-
|
|
87
|
+
@include colors(#{$color-name}, #{$color-value});
|
|
21
88
|
}
|
|
22
89
|
|
|
23
90
|
@for $color-index from 1 through length($helio-colors) {
|
|
24
91
|
$color: nth($helio-colors, $color-index);
|
|
92
|
+
$color-name: nth($color, 1);
|
|
93
|
+
$color-value: nth($color, 2);
|
|
25
94
|
|
|
26
|
-
@include colors(#{
|
|
95
|
+
@include colors(#{$color-name}, #{$color-value});
|
|
27
96
|
}
|
|
@@ -1,15 +1,48 @@
|
|
|
1
1
|
@for $font-size-index from 1 through length($helio-font-sizes) {
|
|
2
|
-
$
|
|
2
|
+
$name: $font-size-index;
|
|
3
|
+
$value: nth($helio-font-sizes, $font-size-index);
|
|
3
4
|
|
|
4
|
-
.fs-#{$
|
|
5
|
-
|
|
5
|
+
.fs-#{$name},
|
|
6
|
+
.fs-xs-#{$name},
|
|
7
|
+
.fs-#{$name}-hover:hover,
|
|
8
|
+
.fs-xs-#{$name}-hover:hover,
|
|
9
|
+
.active .fs-#{$name}-active,
|
|
10
|
+
.active .fs-xs-#{$name}-active {
|
|
11
|
+
font-size: $value;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
@media (min-width: $screen-sm-min) {
|
|
15
|
+
.fs-sm-#{$name},
|
|
16
|
+
.fs-sm-#{$name}-hover:hover,
|
|
17
|
+
.active .fs-sm-#{$name}-active {
|
|
18
|
+
font-size: $value;
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
@media (min-width: $screen-md-min) {
|
|
23
|
+
.fs-md-#{$name},
|
|
24
|
+
.fs-md-#{$name}-hover:hover,
|
|
25
|
+
.active .fs-md-#{$name}-active {
|
|
26
|
+
font-size: $value;
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
@media (min-width: $screen-lg-min) {
|
|
31
|
+
.fs-lg-#{$name},
|
|
32
|
+
.fs-lg-#{$name}-hover:hover,
|
|
33
|
+
.active .fs-lg-#{$name}-active {
|
|
34
|
+
font-size: $value;
|
|
35
|
+
}
|
|
6
36
|
}
|
|
7
37
|
}
|
|
8
38
|
|
|
9
39
|
@for $font-weight-index from 1 through length($helio-font-weights) {
|
|
10
|
-
$
|
|
40
|
+
$name: $font-weight-index;
|
|
41
|
+
$value: nth($helio-font-weights, $font-weight-index);
|
|
11
42
|
|
|
12
|
-
.fw-#{$
|
|
13
|
-
|
|
43
|
+
.fw-#{$name},
|
|
44
|
+
.fw-#{$name}-hover:hover,
|
|
45
|
+
.active .fw-#{$name}-active {
|
|
46
|
+
font-weight: $value;
|
|
14
47
|
}
|
|
15
48
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@include "mixins/generators";
|
|
@@ -1,112 +1,226 @@
|
|
|
1
1
|
@mixin paddings($name, $value) {
|
|
2
|
-
.pt-#{$name},
|
|
2
|
+
.pt-#{$name},
|
|
3
|
+
.pv-#{$name},
|
|
4
|
+
.pa-#{$name},
|
|
5
|
+
.pt-#{$name}-hover:hover,
|
|
6
|
+
.pv-#{$name}-hover:hover,
|
|
7
|
+
.pa-#{$name}-hover:hover,
|
|
8
|
+
.active .pt-#{$name}-active,
|
|
9
|
+
.active .pv-#{$name}-active,
|
|
10
|
+
.active .pa-#{$name}-active,
|
|
11
|
+
.pt-#{$name}-plus + .pt-#{$name}-plus {
|
|
3
12
|
padding-top: $value;
|
|
4
13
|
}
|
|
5
14
|
|
|
6
|
-
.pl-#{$name},
|
|
15
|
+
.pl-#{$name},
|
|
16
|
+
.ph-#{$name},
|
|
17
|
+
.pa-#{$name},
|
|
18
|
+
.pl-#{$name}-hover:hover,
|
|
19
|
+
.ph-#{$name}-hover:hover,
|
|
20
|
+
.pa-#{$name}-hover:hover,
|
|
21
|
+
.active .pl-#{$name}-active,
|
|
22
|
+
.active .ph-#{$name}-active,
|
|
23
|
+
.active .pa-#{$name}-active,
|
|
24
|
+
.pl-#{$name}-plus + .pl-#{$name}-plus {
|
|
7
25
|
padding-left: $value;
|
|
8
26
|
}
|
|
9
27
|
|
|
10
|
-
.pb-#{$name},
|
|
28
|
+
.pb-#{$name},
|
|
29
|
+
.pv-#{$name},
|
|
30
|
+
.pa-#{$name},
|
|
31
|
+
.pb-#{$name}-hover:hover,
|
|
32
|
+
.pv-#{$name}-hover:hover,
|
|
33
|
+
.pa-#{$name}-hover:hover,
|
|
34
|
+
.active .pb-#{$name}-active,
|
|
35
|
+
.active .pv-#{$name}-active,
|
|
36
|
+
.active .pa-#{$name}-active {
|
|
11
37
|
padding-bottom: $value;
|
|
12
38
|
}
|
|
13
39
|
|
|
14
|
-
.pr-#{$name},
|
|
40
|
+
.pr-#{$name},
|
|
41
|
+
.ph-#{$name},
|
|
42
|
+
.pa-#{$name},
|
|
43
|
+
.pr-#{$name}-hover:hover,
|
|
44
|
+
.ph-#{$name}-hover:hover,
|
|
45
|
+
.pa-#{$name}-hover:hover,
|
|
46
|
+
.active .pr-#{$name}-active,
|
|
47
|
+
.active .ph-#{$name}-active,
|
|
48
|
+
.active .pa-#{$name}-active,
|
|
49
|
+
.pr-#{$name}-plus + .pr-#{$name}-plus {
|
|
15
50
|
padding-right: $value;
|
|
16
51
|
}
|
|
17
52
|
}
|
|
18
53
|
|
|
19
54
|
@mixin margins($name, $value) {
|
|
20
|
-
.mt-#{$name},
|
|
55
|
+
.mt-#{$name},
|
|
56
|
+
.mv-#{$name},
|
|
57
|
+
.ma-#{$name},
|
|
58
|
+
.mt-#{$name}-hover:hover,
|
|
59
|
+
.mv-#{$name}-hover:hover,
|
|
60
|
+
.ma-#{$name}-hover:hover,
|
|
61
|
+
.active .mt-#{$name}-active,
|
|
62
|
+
.active .mv-#{$name}-active,
|
|
63
|
+
.active .ma-#{$name}-active,
|
|
64
|
+
.mt-#{$name}-plus + .mt-#{$name}-plus {
|
|
21
65
|
margin-top: $value;
|
|
22
66
|
}
|
|
23
67
|
|
|
24
|
-
.ml-#{$name},
|
|
68
|
+
.ml-#{$name},
|
|
69
|
+
.mh-#{$name},
|
|
70
|
+
.ma-#{$name},
|
|
71
|
+
.ml-#{$name}-hover:hover,
|
|
72
|
+
.mh-#{$name}-hover:hover,
|
|
73
|
+
.ma-#{$name}-hover:hover,
|
|
74
|
+
.active .ml-#{$name}-active,
|
|
75
|
+
.active .mh-#{$name}-active,
|
|
76
|
+
.active .ma-#{$name}-active,
|
|
77
|
+
.ml-#{$name}-plus + .ml-#{$name}-plus {
|
|
25
78
|
margin-left: $value;
|
|
26
79
|
}
|
|
27
80
|
|
|
28
|
-
.mb-#{$name},
|
|
81
|
+
.mb-#{$name},
|
|
82
|
+
.mv-#{$name},
|
|
83
|
+
.ma-#{$name},
|
|
84
|
+
.mb-#{$name}-hover:hover,
|
|
85
|
+
.mv-#{$name}-hover:hover,
|
|
86
|
+
.ma-#{$name}-hover:hover,
|
|
87
|
+
.active .mb-#{$name}-active,
|
|
88
|
+
.active .mv-#{$name}-active,
|
|
89
|
+
.active .ma-#{$name}-active {
|
|
29
90
|
margin-bottom: $value;
|
|
30
91
|
}
|
|
31
92
|
|
|
32
|
-
.mr-#{$name},
|
|
93
|
+
.mr-#{$name},
|
|
94
|
+
.mh-#{$name},
|
|
95
|
+
.ma-#{$name},
|
|
96
|
+
.mr-#{$name}-hover:hover,
|
|
97
|
+
.mh-#{$name}-hover:hover,
|
|
98
|
+
.ma-#{$name}-hover:hover,
|
|
99
|
+
.active .mr-#{$name}-active,
|
|
100
|
+
.active .mh-#{$name}-active,
|
|
101
|
+
.active .ma-#{$name}-active,
|
|
102
|
+
.mr-#{$name}-plus + .mr-#{$name}-plus {
|
|
33
103
|
margin-right: $value;
|
|
34
104
|
}
|
|
35
105
|
}
|
|
36
106
|
|
|
37
107
|
@mixin negative-margins($name, $value) {
|
|
38
|
-
.nmt-#{$name},
|
|
108
|
+
.nmt-#{$name},
|
|
109
|
+
.nmv-#{$name},
|
|
110
|
+
.nma-#{$name},
|
|
111
|
+
.nmt-#{$name}-hover:hover,
|
|
112
|
+
.nmv-#{$name}-hover:hover,
|
|
113
|
+
.nma-#{$name}-hover:hover,
|
|
114
|
+
.active .nmt-#{$name}-active,
|
|
115
|
+
.active .nmv-#{$name}-active,
|
|
116
|
+
.active .nma-#{$name}-active,
|
|
117
|
+
.nmt-#{$name}-plus + .nmt-#{$name}-plus {
|
|
39
118
|
margin-top: -$value;
|
|
40
119
|
}
|
|
41
120
|
|
|
42
|
-
.nml-#{$name},
|
|
121
|
+
.nml-#{$name},
|
|
122
|
+
.nmh-#{$name},
|
|
123
|
+
.nma-#{$name},
|
|
124
|
+
.nml-#{$name}-hover:hover,
|
|
125
|
+
.nmh-#{$name}-hover:hover,
|
|
126
|
+
.nma-#{$name}-hover:hover,
|
|
127
|
+
.active .nml-#{$name}-active,
|
|
128
|
+
.active .nmh-#{$name}-active,
|
|
129
|
+
.active .nma-#{$name}-active,
|
|
130
|
+
.nml-#{$name}-plus + .nml-#{$name}-plus {
|
|
43
131
|
margin-left: -$value;
|
|
44
132
|
}
|
|
45
133
|
|
|
46
|
-
.nmb-#{$name},
|
|
134
|
+
.nmb-#{$name},
|
|
135
|
+
.nmv-#{$name},
|
|
136
|
+
.nma-#{$name},
|
|
137
|
+
.nmb-#{$name}-hover:hover,
|
|
138
|
+
.nmv-#{$name}-hover:hover,
|
|
139
|
+
.nma-#{$name}-hover:hover,
|
|
140
|
+
.active .nmb-#{$name}-active,
|
|
141
|
+
.active .nmv-#{$name}-active,
|
|
142
|
+
.active .nma-#{$name}-active {
|
|
47
143
|
margin-bottom: -$value;
|
|
48
144
|
}
|
|
49
145
|
|
|
50
|
-
.nmr-#{$name},
|
|
146
|
+
.nmr-#{$name},
|
|
147
|
+
.nmh-#{$name},
|
|
148
|
+
.nma-#{$name},
|
|
149
|
+
.nmr-#{$name}-hover:hover,
|
|
150
|
+
.nmh-#{$name}-hover:hover,
|
|
151
|
+
.nma-#{$name}-hover:hover,
|
|
152
|
+
.active .nmr-#{$name}-active,
|
|
153
|
+
.active .nmh-#{$name}-active,
|
|
154
|
+
.active .nma-#{$name}-active,
|
|
155
|
+
.nmr-#{$name}-plus + .mmr-#{$name}-plus {
|
|
51
156
|
margin-right: -$value;
|
|
52
157
|
}
|
|
53
158
|
}
|
|
54
159
|
|
|
55
160
|
@mixin dimensions($name, $value) {
|
|
56
|
-
.dv-#{$name},
|
|
161
|
+
.dv-#{$name},
|
|
162
|
+
.da-#{$name},
|
|
163
|
+
.dv-#{$name}-hover:hover,
|
|
164
|
+
.da-#{$name}-hover:hover,
|
|
165
|
+
.active .dv-#{$name}-active,
|
|
166
|
+
.active .da-#{$name}-active {
|
|
57
167
|
height: $value;
|
|
58
168
|
}
|
|
59
169
|
|
|
60
|
-
.dh-#{$name},
|
|
170
|
+
.dh-#{$name},
|
|
171
|
+
.da-#{$name},
|
|
172
|
+
.dh-#{$name}-hover:hover,
|
|
173
|
+
.da-#{$name}-hover:hover,
|
|
174
|
+
.active .dh-#{$name}-active,
|
|
175
|
+
.active .da-#{$name}-active {
|
|
61
176
|
width: $value;
|
|
62
177
|
}
|
|
63
178
|
}
|
|
64
179
|
|
|
65
180
|
@mixin line-heights($name, $value) {
|
|
66
|
-
.lh-#{$name}
|
|
181
|
+
.lh-#{$name},
|
|
182
|
+
.lh-#{$name}-hover:hover,
|
|
183
|
+
.active .lh-#{$name}-active {
|
|
67
184
|
line-height: $value;
|
|
68
185
|
}
|
|
69
186
|
}
|
|
70
187
|
|
|
71
188
|
@include dimensions(0, 0px);
|
|
72
|
-
|
|
73
189
|
@for $space-index from 1 through length($helio-spaces) {
|
|
74
|
-
$
|
|
190
|
+
$name: $space-index;
|
|
191
|
+
$value: nth($helio-spaces, $space-index);
|
|
75
192
|
|
|
76
|
-
@include dimensions($
|
|
193
|
+
@include dimensions($name, $value);
|
|
77
194
|
}
|
|
78
195
|
|
|
79
196
|
@include line-heights(0, 0px);
|
|
80
|
-
|
|
81
197
|
@for $space-index from 1 through length($helio-spaces) {
|
|
82
|
-
$
|
|
198
|
+
$name: $space-index;
|
|
199
|
+
$value: nth($helio-spaces, $space-index);
|
|
83
200
|
|
|
84
|
-
@include line-heights($
|
|
201
|
+
@include line-heights($name, $value);
|
|
85
202
|
}
|
|
86
203
|
|
|
87
204
|
@include paddings(0, 0px);
|
|
88
|
-
|
|
89
205
|
@for $space-index from 1 through length($helio-spaces) {
|
|
90
|
-
$
|
|
206
|
+
$name: $space-index;
|
|
207
|
+
$value: nth($helio-spaces, $space-index);
|
|
91
208
|
|
|
92
|
-
@include paddings($
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
.mh-a {
|
|
96
|
-
margin-left: auto;
|
|
97
|
-
margin-right: auto;
|
|
209
|
+
@include paddings($name, $value);
|
|
98
210
|
}
|
|
99
211
|
|
|
212
|
+
@include margins(a, auto);
|
|
100
213
|
@include margins(0, 0px);
|
|
101
|
-
|
|
102
214
|
@for $space-index from 1 through length($helio-spaces) {
|
|
103
|
-
$
|
|
215
|
+
$name: $space-index;
|
|
216
|
+
$value: nth($helio-spaces, $space-index);
|
|
104
217
|
|
|
105
|
-
@include margins($
|
|
218
|
+
@include margins($name, $value);
|
|
106
219
|
}
|
|
107
220
|
|
|
108
221
|
@for $space-index from 1 through length($helio-spaces) {
|
|
109
|
-
$
|
|
222
|
+
$name: $space-index;
|
|
223
|
+
$value: nth($helio-spaces, $space-index);
|
|
110
224
|
|
|
111
|
-
@include negative-margins($
|
|
225
|
+
@include negative-margins($name, $value);
|
|
112
226
|
}
|
|
@@ -0,0 +1,153 @@
|
|
|
1
|
+
.z-1 {
|
|
2
|
+
z-index: 1;
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
.z-2 {
|
|
6
|
+
z-index: 2;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.z-3 {
|
|
10
|
+
z-index: 3;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
.z-4 {
|
|
14
|
+
z-index: 4;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.z-5 {
|
|
18
|
+
z-index: 5;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.top {
|
|
22
|
+
top: 0px;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
.left {
|
|
26
|
+
left: 0px;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
.bottom {
|
|
30
|
+
bottom: 0px;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.right {
|
|
34
|
+
right: 0px;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
.ntop {
|
|
38
|
+
top: 100%;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.nleft {
|
|
42
|
+
left: 100%;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
.nbottom {
|
|
46
|
+
bottom: 100%;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.nright {
|
|
50
|
+
right: 100%;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
.stc-xs {
|
|
54
|
+
position: static;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
.rel-xs {
|
|
58
|
+
position: relative;
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
.abs-xs {
|
|
62
|
+
positon: absolute;
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
.fix-xs {
|
|
66
|
+
position: fixed;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
.pull-left-xs {
|
|
70
|
+
float: left;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.pull-right-xs {
|
|
74
|
+
float: right;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
@media (min-width: $screen-sm-min) {
|
|
78
|
+
.stc-sm {
|
|
79
|
+
position: static;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
.rel-sm {
|
|
83
|
+
position: relative;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
.abs-sm {
|
|
87
|
+
positon: absolute;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.fix-sm {
|
|
91
|
+
position: fixed;
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
.pull-left-sm {
|
|
95
|
+
float: left;
|
|
96
|
+
}
|
|
97
|
+
|
|
98
|
+
.pull-right-sm {
|
|
99
|
+
float: right;
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
@media (min-width: $screen-md-min) {
|
|
104
|
+
.stc-md {
|
|
105
|
+
position: static;
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
.rel-md {
|
|
109
|
+
position: relative;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
.abs-md {
|
|
113
|
+
positon: absolute;
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
.fix-md {
|
|
117
|
+
position: fixed;
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
.pull-left-md {
|
|
121
|
+
float: left;
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
.pull-right-md {
|
|
125
|
+
float: right;
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
@media (min-width: $screen-lg-min) {
|
|
130
|
+
.stc-lg {
|
|
131
|
+
position: static;
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
.rel-lg {
|
|
135
|
+
position: relative;
|
|
136
|
+
}
|
|
137
|
+
|
|
138
|
+
.abs-lg {
|
|
139
|
+
positon: absolute;
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
.fix-lg {
|
|
143
|
+
position: fixed;
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
.pull-left-lg {
|
|
147
|
+
float: left;
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
.pull-right-lg {
|
|
151
|
+
float: right;
|
|
152
|
+
}
|
|
153
|
+
}
|
|
@@ -1,71 +1,99 @@
|
|
|
1
|
-
$helio-shades:
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
) !default;
|
|
1
|
+
$helio-shades: #000000,
|
|
2
|
+
#111111,
|
|
3
|
+
#222222,
|
|
4
|
+
#333333,
|
|
5
|
+
#444444,
|
|
6
|
+
#555555,
|
|
7
|
+
#666666,
|
|
8
|
+
#777777,
|
|
9
|
+
#888888,
|
|
10
|
+
#999999,
|
|
11
|
+
#AAAAAA,
|
|
12
|
+
#BBBBBB,
|
|
13
|
+
#CCCCCC,
|
|
14
|
+
#DDDDDD,
|
|
15
|
+
#EEEEEE,
|
|
16
|
+
#FFFFFF
|
|
17
|
+
!default;
|
|
19
18
|
|
|
20
|
-
$helio-colors:
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
) !default;
|
|
19
|
+
$helio-colors: (red: #FF0000,
|
|
20
|
+
green: #16DE7A,
|
|
21
|
+
blue: #3A6EFC)
|
|
22
|
+
!default;
|
|
25
23
|
|
|
26
|
-
$helio-spaces:
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
) !default;
|
|
24
|
+
$helio-spaces: 1px,
|
|
25
|
+
5px,
|
|
26
|
+
7.5px,
|
|
27
|
+
10px,
|
|
28
|
+
15px,
|
|
29
|
+
20px,
|
|
30
|
+
30px,
|
|
31
|
+
40px,
|
|
32
|
+
50px,
|
|
33
|
+
60px,
|
|
34
|
+
80px,
|
|
35
|
+
100px
|
|
36
|
+
!default;
|
|
40
37
|
|
|
41
|
-
$helio-font-sizes:
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
) !default;
|
|
38
|
+
$helio-font-sizes: 10px,
|
|
39
|
+
11px,
|
|
40
|
+
12px,
|
|
41
|
+
13px,
|
|
42
|
+
14px,
|
|
43
|
+
15px,
|
|
44
|
+
16px,
|
|
45
|
+
17px,
|
|
46
|
+
18px,
|
|
47
|
+
20px,
|
|
48
|
+
22px,
|
|
49
|
+
24px,
|
|
50
|
+
26px,
|
|
51
|
+
28px,
|
|
52
|
+
32px,
|
|
53
|
+
36px,
|
|
54
|
+
42px,
|
|
55
|
+
48px,
|
|
56
|
+
54px,
|
|
57
|
+
62px,
|
|
58
|
+
72px,
|
|
59
|
+
84px,
|
|
60
|
+
100px
|
|
61
|
+
!default;
|
|
66
62
|
|
|
67
|
-
$helio-font-weights:
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
63
|
+
$helio-font-weights: 300,
|
|
64
|
+
400,
|
|
65
|
+
700
|
|
66
|
+
!default;
|
|
67
|
+
|
|
68
|
+
$helio-border-widths: 1px,
|
|
69
|
+
2px,
|
|
70
|
+
5px
|
|
71
|
+
!default;
|
|
72
|
+
|
|
73
|
+
$helio-border-radiuses: 2px,
|
|
74
|
+
5px,
|
|
75
|
+
10px,
|
|
76
|
+
12px,
|
|
77
|
+
20px,
|
|
78
|
+
30px
|
|
79
|
+
!default;
|
|
80
|
+
|
|
81
|
+
|
|
82
|
+
//== Media queries breakpoints
|
|
83
|
+
//== Credit: Bootstrap
|
|
84
|
+
//
|
|
85
|
+
//## Define the breakpoints at which your layout will change, adapting to different screen sizes.
|
|
86
|
+
|
|
87
|
+
// Small screen / tablet
|
|
88
|
+
$screen-sm-min: 768px !default;
|
|
89
|
+
|
|
90
|
+
// Medium screen / desktop
|
|
91
|
+
$screen-md-min: 992px !default;
|
|
92
|
+
|
|
93
|
+
// Large screen / wide desktop
|
|
94
|
+
$screen-lg-min: 1200px !default;
|
|
95
|
+
|
|
96
|
+
// So media queries don't overlap when required, provide a maximum
|
|
97
|
+
$screen-xs-max: ($screen-sm-min - 1) !default;
|
|
98
|
+
$screen-sm-max: ($screen-md-min - 1) !default;
|
|
99
|
+
$screen-md-max: ($screen-lg-min - 1) !default;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
html {
|
|
2
|
+
height: 100%;
|
|
3
|
+
min-height: 100%;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
body {
|
|
7
|
+
height: 100%;
|
|
8
|
+
|
|
9
|
+
a, a:hover, a:visited {
|
|
10
|
+
color: inherit;
|
|
11
|
+
text-decoration: none;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
// Clear border stylings
|
|
15
|
+
* {
|
|
16
|
+
border-width: 0px;
|
|
17
|
+
outline-width: 0px;
|
|
18
|
+
}
|
|
19
|
+
}
|
data/lib/helio/version.rb
CHANGED
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: helio
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.0.0.
|
|
4
|
+
version: 0.0.0.8
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Paul Jovanovic
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2015-05-
|
|
11
|
+
date: 2015-05-20 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: sass
|
|
@@ -189,11 +189,16 @@ files:
|
|
|
189
189
|
- README.md
|
|
190
190
|
- Rakefile
|
|
191
191
|
- assets/stylesheets/_helio.scss
|
|
192
|
+
- assets/stylesheets/helio/_borders.scss
|
|
192
193
|
- assets/stylesheets/helio/_colors.scss
|
|
193
194
|
- assets/stylesheets/helio/_fonts.scss
|
|
194
195
|
- assets/stylesheets/helio/_functions.scss
|
|
196
|
+
- assets/stylesheets/helio/_mixins.scss
|
|
195
197
|
- assets/stylesheets/helio/_spaces.scss
|
|
198
|
+
- assets/stylesheets/helio/_utilities.scss
|
|
196
199
|
- assets/stylesheets/helio/_variables.scss
|
|
200
|
+
- assets/stylesheets/helio/mixins/generators.scss
|
|
201
|
+
- assets/stylesheets/helio/normalize.scss
|
|
197
202
|
- helio.gemspec
|
|
198
203
|
- lib/helio.rb
|
|
199
204
|
- lib/helio/engine.rb
|