piecss 0.6.0 → 0.7.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/sass/piecss/_behavior.scss +5 -0
- data/sass/piecss/_settings.scss +2 -2
- data/sass/piecss/_utilities.scss +2 -4
- data/sass/piecss/behavior/anchor/_anchor.scss +7 -21
- data/sass/piecss/behavior/anchor/_settings.scss +11 -0
- data/sass/piecss/behavior/base/_base.scss +0 -1
- data/sass/piecss/behavior/base/_collection.scss +3 -3
- data/sass/piecss/behavior/base/_settings.scss +1 -1
- data/sass/piecss/behavior/debug/_behavior.scss +22 -0
- data/sass/piecss/behavior/debug/_mixins.scss +127 -0
- data/sass/piecss/behavior/debug/_settings.scss +81 -0
- data/sass/piecss/behavior/is/_collection.scss +57 -0
- data/sass/piecss/behavior/is/_settings.scss +12 -0
- data/sass/piecss/behavior/layout/_bleed.scss +23 -0
- data/sass/piecss/behavior/layout/_chain.scss +45 -0
- data/sass/piecss/behavior/layout/_column.scss +14 -0
- data/sass/piecss/behavior/layout/_grid.scss +13 -3
- data/sass/piecss/behavior/layout/_gutters.scss +32 -0
- data/sass/piecss/behavior/layout/_layout.scss +29 -29
- data/sass/piecss/behavior/layout/_leader.scss +57 -0
- data/sass/piecss/behavior/layout/_trailer.scss +57 -0
- data/sass/piecss/behavior/layout/_wings.scss +122 -0
- data/sass/piecss/behavior/list/_list.scss +134 -175
- data/sass/piecss/behavior/list/_settings.scss +9 -31
- data/sass/piecss/settings/_colour.scss +10 -1
- data/sass/piecss/settings/_font.scss +0 -1
- data/sass/piecss/settings/_grid.scss +119 -0
- data/sass/piecss/settings/_legacy.scss +24 -0
- data/sass/piecss/settings/_rhythm.scss +0 -10
- data/sass/piecss/utilities/_collection.scss +5 -1
- data/sass/piecss/utilities/_colour.scss +3 -3
- data/sass/piecss/utilities/_grid.scss +355 -0
- data/sass/piecss/utilities/_legacy.scss +42 -0
- data/sass/piecss/utilities/_miscellaneous.scss +8 -82
- data/sass/piecss/utilities/_rhythm.scss +7 -36
- data/sass/piecss/utilities/_typography.scss +8 -98
- data/templates/project/_sets.scss +2 -3
- data/templates/project/_settings.scss +26 -27
- data/{sass/piecss/_behavior.css → templates/project/assets/css/screen.css} +100 -5
- data/templates/project/assets/images/piecss.png +0 -0
- data/templates/project/assets/images/piecss.svg +25 -0
- data/templates/project/examples.html +2 -2
- data/templates/project/screen.scss +8 -11
- metadata +21 -61
- data/sass/piecss/_behavior.css.map +0 -7
- data/sass/piecss/_settings.css +0 -2
- data/sass/piecss/_settings.css.map +0 -7
- data/sass/piecss/_utilities.css +0 -3
- data/sass/piecss/_utilities.css.map +0 -7
- data/sass/piecss/behavior/layout/_rhythm.scss +0 -21
- data/sass/piecss/settings/_breakpoint.css +0 -70
- data/sass/piecss/settings/_colour.css +0 -2
- data/sass/piecss/settings/_colour.css.map +0 -7
- data/sass/piecss/settings/_constants.css +0 -2
- data/sass/piecss/settings/_constants.css.map +0 -7
- data/sass/piecss/settings/_fallback.css +0 -2
- data/sass/piecss/settings/_fallback.css.map +0 -7
- data/sass/piecss/settings/_fallback.scss +0 -15
- data/sass/piecss/settings/_font.css +0 -2
- data/sass/piecss/settings/_font.css.map +0 -7
- data/sass/piecss/settings/_layout.css +0 -60
- data/sass/piecss/settings/_layout.scss +0 -168
- data/sass/piecss/settings/_miscellaneous.css +0 -2
- data/sass/piecss/settings/_miscellaneous.css.map +0 -7
- data/sass/piecss/settings/_rhythm.css +0 -2
- data/sass/piecss/settings/_rhythm.css.map +0 -7
- data/sass/piecss/settings/_typography.css +0 -2
- data/sass/piecss/settings/_typography.css.map +0 -7
- data/sass/piecss/settings/_unit.css +0 -2
- data/sass/piecss/settings/_unit.css.map +0 -7
- data/sass/piecss/settings/fonts/_verdana.scss +0 -40
- data/sass/piecss/utilities/_breakpoint.css +0 -2
- data/sass/piecss/utilities/_breakpoint.css.map +0 -7
- data/sass/piecss/utilities/_cache.css +0 -2
- data/sass/piecss/utilities/_cache.css.map +0 -7
- data/sass/piecss/utilities/_cache.scss +0 -78
- data/sass/piecss/utilities/_colour.css +0 -2
- data/sass/piecss/utilities/_colour.css.map +0 -7
- data/sass/piecss/utilities/_element.css +0 -2
- data/sass/piecss/utilities/_element.css.map +0 -7
- data/sass/piecss/utilities/_image.css +0 -2
- data/sass/piecss/utilities/_image.css.map +0 -7
- data/sass/piecss/utilities/_layout.css +0 -2
- data/sass/piecss/utilities/_layout.css.map +0 -7
- data/sass/piecss/utilities/_layout.scss +0 -570
- data/sass/piecss/utilities/_list.css +0 -2
- data/sass/piecss/utilities/_list.css.map +0 -7
- data/sass/piecss/utilities/_list.scss +0 -26
- data/sass/piecss/utilities/_miscellaneous.css +0 -2
- data/sass/piecss/utilities/_miscellaneous.css.map +0 -7
- data/sass/piecss/utilities/_rhythm.css +0 -2
- data/sass/piecss/utilities/_rhythm.css.map +0 -7
- data/sass/piecss/utilities/_side.css +0 -2
- data/sass/piecss/utilities/_side.css.map +0 -7
- data/sass/piecss/utilities/_side.scss +0 -370
- data/sass/piecss/utilities/_string.css +0 -2
- data/sass/piecss/utilities/_string.css.map +0 -7
- data/sass/piecss/utilities/_svg.css +0 -2
- data/sass/piecss/utilities/_svg.css.map +0 -7
- data/sass/piecss/utilities/_typography.css +0 -2
- data/sass/piecss/utilities/_typography.css.map +0 -7
- data/sass/piecss/utilities/_unit.css +0 -2
- data/sass/piecss/utilities/_unit.css.map +0 -7
@@ -65,40 +65,11 @@
|
|
65
65
|
///
|
66
66
|
|
67
67
|
@mixin rhythm($units, $property, $context: $default-font-size) {
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
}
|
76
|
-
|
77
|
-
|
78
|
-
///
|
79
|
-
/// Reveals the document's vertical rhythm. Will automatically be mixed in when [$debug-rhythm](./#variable-debug-rhythm) is set to true.
|
80
|
-
///
|
81
|
-
/// @since 0.1
|
82
|
-
///
|
83
|
-
/// @param {Number} $rhythm - The rhythm height
|
84
|
-
///
|
85
|
-
|
86
|
-
@mixin debug-rhythm($rhythm: $rhythm) {
|
87
|
-
$to: transparent;
|
88
|
-
$from: rgba($lightcyan, .5);
|
89
|
-
|
90
|
-
background-image: linear-gradient($from 50%, $to 50%);
|
91
|
-
background-size: (2 * $rhythm) (2 * $rhythm);
|
92
|
-
|
93
|
-
* {
|
94
|
-
// scss-lint:disable ImportantRule DuplicateProperty
|
95
|
-
background-image: none !important;
|
96
|
-
background-color: transparent !important;
|
97
|
-
outline: rgba($fuchsia, .1) dotted 1px;
|
98
|
-
outline: $lightgray dotted 1px;
|
99
|
-
// scss-lint:enable ImportantRule DuplicateProperty
|
100
|
-
@include old-ie {
|
101
|
-
outline: lighten($fuchsia, .1) dotted 1px \9;
|
102
|
-
}
|
103
|
-
}
|
68
|
+
// @if strip-unit($units)==0 {
|
69
|
+
// #{$property}: 0;
|
70
|
+
// }
|
71
|
+
// @if unit($unit)==rem {
|
72
|
+
// #{$property}: $units*$gutter-width;
|
73
|
+
// }
|
74
|
+
// #{$property}: rhythm($units, $context);
|
104
75
|
}
|
@@ -12,12 +12,6 @@
|
|
12
12
|
// weight-number-to-string
|
13
13
|
// 2. mixins:
|
14
14
|
// font
|
15
|
-
// font-style
|
16
|
-
// font-variant
|
17
|
-
// font-weight
|
18
|
-
// font-family
|
19
|
-
// font-size
|
20
|
-
// line-height
|
21
15
|
|
22
16
|
|
23
17
|
// 1. FUNCTIONS
|
@@ -28,7 +22,7 @@
|
|
28
22
|
///
|
29
23
|
/// @since 0.1
|
30
24
|
///
|
31
|
-
/// @todo
|
25
|
+
/// @todo $type should either be a space separated list, or property map
|
32
26
|
///
|
33
27
|
/// @param {List} $type: a valid type list ($style, $variant, $weight, $family)
|
34
28
|
///
|
@@ -45,7 +39,7 @@
|
|
45
39
|
///
|
46
40
|
/// @since 0.1
|
47
41
|
///
|
48
|
-
/// @todo
|
42
|
+
/// @todo $type should either be a space separated list, or property map
|
49
43
|
///
|
50
44
|
/// @param {List} $type: a valid type list ($style, $variant, $weight, $family)
|
51
45
|
///
|
@@ -62,7 +56,7 @@
|
|
62
56
|
///
|
63
57
|
/// @since 0.1
|
64
58
|
///
|
65
|
-
/// @todo
|
59
|
+
/// @todo $type should either be a space separated list, or property map
|
66
60
|
///
|
67
61
|
/// @param {List} $type: a valid type list ($style, $variant, $weight, $family)
|
68
62
|
///
|
@@ -79,7 +73,7 @@
|
|
79
73
|
///
|
80
74
|
/// @since 0.1
|
81
75
|
///
|
82
|
-
/// @todo
|
76
|
+
/// @todo $type should either be a space separated list, or property map
|
83
77
|
///
|
84
78
|
/// @param {List} $type: a valid type list ($style, $variant, $weight, $family)
|
85
79
|
///
|
@@ -170,11 +164,11 @@
|
|
170
164
|
@if type-of($argument) == list {
|
171
165
|
$type: $argument;
|
172
166
|
}
|
173
|
-
@else {
|
167
|
+
@else {
|
174
168
|
@if not($font-size) {
|
175
169
|
$font-size: $argument;
|
176
170
|
}
|
177
|
-
@elseif not($line-height) {
|
171
|
+
@elseif not($line-height) {
|
178
172
|
$line-height: $argument;
|
179
173
|
}
|
180
174
|
}
|
@@ -188,7 +182,7 @@
|
|
188
182
|
$font-family: get-font-family($type);
|
189
183
|
|
190
184
|
@if $font-size and unit($unit) == rem {
|
191
|
-
|
185
|
+
font-size: to-unit($font-size, 1px)
|
192
186
|
}
|
193
187
|
|
194
188
|
// Build font arguments
|
@@ -196,7 +190,7 @@
|
|
196
190
|
@if $font-size and $line-height {
|
197
191
|
$font: append($font, #{$font-size}/#{$line-height});
|
198
192
|
}
|
199
|
-
@elseif $font-size {
|
193
|
+
@elseif $font-size {
|
200
194
|
$font: append($font, #{$font-size});
|
201
195
|
}
|
202
196
|
$font: append($font, #{$font-family});
|
@@ -204,87 +198,3 @@
|
|
204
198
|
font: #{$font};
|
205
199
|
}
|
206
200
|
}
|
207
|
-
|
208
|
-
|
209
|
-
///
|
210
|
-
/// Extracts the style from a type array and mixes in font-style
|
211
|
-
///
|
212
|
-
/// @since 0.1
|
213
|
-
///
|
214
|
-
/// @param {List} $type: a valid type list ($style, $variant, $weight, $family)
|
215
|
-
///
|
216
|
-
|
217
|
-
@mixin font-style($type) {
|
218
|
-
font-style: get-font-style($type);
|
219
|
-
}
|
220
|
-
|
221
|
-
|
222
|
-
///
|
223
|
-
/// Extracts the variant from a type array and mixes in font-variant
|
224
|
-
///
|
225
|
-
/// @since 0.1
|
226
|
-
///
|
227
|
-
/// @param {List} $type: a valid type list ($style, $variant, $weight, $family)
|
228
|
-
///
|
229
|
-
|
230
|
-
@mixin font-variant($type) {
|
231
|
-
font-variant: get-font-variant($type);
|
232
|
-
}
|
233
|
-
|
234
|
-
|
235
|
-
///
|
236
|
-
/// Extracts the weight from a type array and mixes in font-weight
|
237
|
-
///
|
238
|
-
/// @since 0.1
|
239
|
-
///
|
240
|
-
/// @param {List} $type: a valid type list ($style, $variant, $weight, $family)
|
241
|
-
///
|
242
|
-
|
243
|
-
@mixin font-weight($type) {
|
244
|
-
font-weight: get-font-weight($type);
|
245
|
-
}
|
246
|
-
|
247
|
-
|
248
|
-
///
|
249
|
-
/// Extracts the family from a type array and mixes in font-family
|
250
|
-
///
|
251
|
-
/// @since 0.1
|
252
|
-
///
|
253
|
-
/// @param {List} $type: a valid type list ($style, $variant, $weight, $family)
|
254
|
-
///
|
255
|
-
|
256
|
-
@mixin font-family($type) {
|
257
|
-
font-family: get-font-family($type);
|
258
|
-
}
|
259
|
-
|
260
|
-
|
261
|
-
///
|
262
|
-
/// Takes a size in px and calculates it back to the final font-unit. Provides fallback if the final output is in rem.
|
263
|
-
///
|
264
|
-
/// @since 0.1
|
265
|
-
///
|
266
|
-
/// @param {Number} $target-px - The font-size in px
|
267
|
-
/// @param {Number} $unit ($unit) - The final unit to which $target-px is converted, e.g.px | rem | em | %
|
268
|
-
/// @param {Number} $context ($font-size) - The context of the targeted element, for calculations to em or %
|
269
|
-
///
|
270
|
-
|
271
|
-
@mixin font-size($target-px, $unit: $unit, $context: $font-size) {
|
272
|
-
@if unit($unit) == rem {
|
273
|
-
font-size: to-unit($target-px, $rem-fallback-unit, $context);
|
274
|
-
}
|
275
|
-
font-size: to-unit($target-px, $unit, $context);
|
276
|
-
}
|
277
|
-
|
278
|
-
///
|
279
|
-
/// Mixin for line-height
|
280
|
-
///
|
281
|
-
/// @since 0.1
|
282
|
-
///
|
283
|
-
/// @param {Number} $target-px - the line-height in px
|
284
|
-
/// @param {Number} $context ($font-size) - The context of the targeted element, for calculations to em
|
285
|
-
/// @param {Number} $unit ($line-height-unit) - The final unit to which $target-px is converted, e.g. 1px, 1rem, 1em, 1% or 1 for unitless
|
286
|
-
///
|
287
|
-
|
288
|
-
@mixin line-height($font-size, $min-ratio: 1.5) {
|
289
|
-
line-height: line-height($font-size, $min-ratio);
|
290
|
-
}
|
@@ -1,29 +1,28 @@
|
|
1
|
-
|
2
|
-
///
|
3
|
-
///
|
4
|
-
///
|
1
|
+
// /// Copyright (C) 2014 Babs Gösgens. All rights reserved.
|
2
|
+
// /// Licensed under MIT; see LICENSE.txt
|
3
|
+
// ///
|
5
4
|
|
6
|
-
// Example configuration for columns
|
7
|
-
$column-widths: (
|
8
|
-
|
9
|
-
|
10
|
-
);
|
5
|
+
// // Example configuration for columns
|
6
|
+
// $column-widths: (
|
7
|
+
// $small_handheld: (main: 1/1, side: 1/1),
|
8
|
+
// $small_desktop: (main: 2/3, side: 1/3),
|
9
|
+
// );
|
11
10
|
|
12
|
-
// Example configuration for layout
|
13
|
-
$layouts: (
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
);
|
11
|
+
// // Example configuration for layout
|
12
|
+
// $layouts: (
|
13
|
+
// $small_handheld: (
|
14
|
+
// columns: 4,
|
15
|
+
// color: $orange,
|
16
|
+
// pages: (),
|
17
|
+
// ),
|
18
|
+
// $medium_handheld: (
|
19
|
+
// columns: 8,
|
20
|
+
// color: $cyan,
|
21
|
+
// pages: (),
|
22
|
+
// ),
|
23
|
+
// $small_desktop: (
|
24
|
+
// columns: 12,
|
25
|
+
// color: $becca,
|
26
|
+
// pages: (),
|
27
|
+
// )
|
28
|
+
// );
|
@@ -1,4 +1,13 @@
|
|
1
1
|
@charset "UTF-8";
|
2
|
+
/*! piecss.scss v0.1 | MIT License | git.io/piecss/piecss */
|
3
|
+
/* it's an official colour these days! */
|
4
|
+
/* alternate spelling */
|
5
|
+
/* alternate spelling */
|
6
|
+
/* alternate spelling */
|
7
|
+
/* alternate spelling */
|
8
|
+
/* alternate spelling */
|
9
|
+
/* alternate spelling */
|
10
|
+
/* alternate spelling */
|
2
11
|
/* it's an official colour these days! */
|
3
12
|
/* alternate spelling */
|
4
13
|
/* alternate spelling */
|
@@ -378,7 +387,7 @@ td, th {
|
|
378
387
|
padding: 0; }
|
379
388
|
|
380
389
|
q {
|
381
|
-
quotes:
|
390
|
+
quotes: “ ” ‘ ’; }
|
382
391
|
|
383
392
|
p, pre, table, hr, article {
|
384
393
|
margin: 0 0 24px; }
|
@@ -409,10 +418,19 @@ a:hover {
|
|
409
418
|
|
410
419
|
/* Layout */
|
411
420
|
/*
|
412
|
-
|
413
|
-
|
414
|
-
|
421
|
+
Grid
|
422
|
+
|
423
|
+
Styleguide 3.97.7
|
415
424
|
*/
|
425
|
+
@media only screen and (min-width: 32.5em) {
|
426
|
+
.grid {
|
427
|
+
column-count: 2;
|
428
|
+
column-gap: 0; } }
|
429
|
+
|
430
|
+
@media only screen and (min-width: 64em) {
|
431
|
+
.grid {
|
432
|
+
column-count: 4; } }
|
433
|
+
|
416
434
|
/* Form */
|
417
435
|
/*
|
418
436
|
-----------------------------------------------------------------------------
|
@@ -429,5 +447,82 @@ Button base
|
|
429
447
|
-----------------------------------------------------------------------------
|
430
448
|
*/
|
431
449
|
/* List */
|
450
|
+
/* Debug */
|
451
|
+
.debug-grid,
|
452
|
+
.debug-layout {
|
453
|
+
position: relative; }
|
454
|
+
.debug-grid::before,
|
455
|
+
.debug-layout::before {
|
456
|
+
pointer-events: none;
|
457
|
+
content: "";
|
458
|
+
display: block;
|
459
|
+
position: absolute;
|
460
|
+
z-index: -1;
|
461
|
+
left: 0;
|
462
|
+
top: 0;
|
463
|
+
width: 100%;
|
464
|
+
height: 100%;
|
465
|
+
background-color: transparent;
|
466
|
+
background-repeat: repeat-x;
|
467
|
+
background-position: 0 0;
|
468
|
+
background-size: 25% 100%;
|
469
|
+
background-image: linear-gradient(to right, rgba(255, 20, 147, 0.1) 0, rgba(255, 20, 147, 0.1) 12px, transparent 12px, transparent 100%), linear-gradient(to left, rgba(255, 20, 147, 0.1) 0, rgba(255, 20, 147, 0.1) 12px, transparent 12px, transparent 100%), linear-gradient(to left, transparent 0%, rgba(0, 0, 0, 0.5) 1px, transparent 1px, transparent 100%); }
|
470
|
+
@media only screen and (min-width: 20em) {
|
471
|
+
.debug-grid::before,
|
472
|
+
.debug-layout::before {
|
473
|
+
background-size: 16.66667% 100%;
|
474
|
+
background-image: linear-gradient(to right, rgba(255, 165, 0, 0.1) 0, rgba(255, 165, 0, 0.1) 12px, transparent 12px, transparent 100%), linear-gradient(to left, rgba(255, 165, 0, 0.1) 0, rgba(255, 165, 0, 0.1) 12px, transparent 12px, transparent 100%), linear-gradient(to left, transparent 0%, rgba(0, 0, 0, 0.5) 1px, transparent 1px, transparent 100%); } }
|
475
|
+
@media only screen and (min-width: 32.5em) {
|
476
|
+
.debug-grid::before,
|
477
|
+
.debug-layout::before {
|
478
|
+
background-size: 11.11111% 100%;
|
479
|
+
background-image: linear-gradient(to right, rgba(0, 255, 255, 0.1) 0, rgba(0, 255, 255, 0.1) 12px, transparent 12px, transparent 100%), linear-gradient(to left, rgba(0, 255, 255, 0.1) 0, rgba(0, 255, 255, 0.1) 12px, transparent 12px, transparent 100%), linear-gradient(to left, transparent 0%, rgba(0, 0, 0, 0.5) 1px, transparent 1px, transparent 100%); } }
|
480
|
+
@media only screen and (min-width: 64em) {
|
481
|
+
.debug-grid::before,
|
482
|
+
.debug-layout::before {
|
483
|
+
background-size: 8.33333% 100%;
|
484
|
+
background-image: linear-gradient(to right, rgba(102, 51, 153, 0.1) 0, rgba(102, 51, 153, 0.1) 12px, transparent 12px, transparent 100%), linear-gradient(to left, rgba(102, 51, 153, 0.1) 0, rgba(102, 51, 153, 0.1) 12px, transparent 12px, transparent 100%), linear-gradient(to left, transparent 0%, rgba(0, 0, 0, 0.5) 1px, transparent 1px, transparent 100%); } }
|
485
|
+
|
486
|
+
.debug-grid,
|
487
|
+
.debug-rhythm {
|
488
|
+
background-image: linear-gradient(rgba(0, 0, 0, 0.05) 50%, transparent 50%);
|
489
|
+
background-size: 16px 16px; }
|
490
|
+
|
491
|
+
.debug-grid,
|
492
|
+
.debug-breakpoint {
|
493
|
+
position: relative; }
|
494
|
+
.debug-grid::after,
|
495
|
+
.debug-breakpoint::after {
|
496
|
+
position: fixed;
|
497
|
+
z-index: 10;
|
498
|
+
top: 16px;
|
499
|
+
left: 16px;
|
500
|
+
display: inline-block;
|
501
|
+
padding: 16px;
|
502
|
+
background: rgba(255, 255, 255, 0.9);
|
503
|
+
color: #000;
|
504
|
+
font-size: small;
|
505
|
+
content: "no breakpoint, columns: 4";
|
506
|
+
border: 2px solid #e61284; }
|
507
|
+
@media only screen and (min-width: 20em) {
|
508
|
+
.debug-grid::after,
|
509
|
+
.debug-breakpoint::after {
|
510
|
+
content: "(min-width: 20em), columns: 6";
|
511
|
+
border: 2px solid #e69500; } }
|
512
|
+
@media only screen and (min-width: 32.5em) {
|
513
|
+
.debug-grid::after,
|
514
|
+
.debug-breakpoint::after {
|
515
|
+
content: "(min-width: 32.5em), columns: 9";
|
516
|
+
border: 2px solid #00e6e6; } }
|
517
|
+
@media only screen and (min-width: 64em) {
|
518
|
+
.debug-grid::after,
|
519
|
+
.debug-breakpoint::after {
|
520
|
+
content: "(min-width: 64em), columns: 12";
|
521
|
+
border: 2px solid #5c2e8a; } }
|
432
522
|
|
433
|
-
|
523
|
+
/*
|
524
|
+
@import "piecss/behavior/base";
|
525
|
+
@import "piecss/behavior/grid";
|
526
|
+
@import "piecss/behavior/form";
|
527
|
+
@import "piecss/behavior/list";
|
528
|
+
*/
|
Binary file
|
@@ -0,0 +1,25 @@
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
2
|
+
<svg width="72px" height="63px" viewBox="0 0 72 63" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
3
|
+
<title>Piecss</title>
|
4
|
+
<defs>
|
5
|
+
<linearGradient x1="-2.74688461%" y1="37.7982406%" x2="113.83436%" y2="61.7461769%" id="linearGradient-1">
|
6
|
+
<stop stop-color="#FBEDB6" offset="0%"></stop>
|
7
|
+
<stop stop-color="#FFE02F" offset="100%"></stop>
|
8
|
+
</linearGradient>
|
9
|
+
<linearGradient x1="0.00162941669%" y1="49.9980053%" x2="100.000833%" y2="49.9980053%" id="linearGradient-2">
|
10
|
+
<stop stop-color="#68BA99" offset="0%"></stop>
|
11
|
+
<stop stop-color="#20AC92" offset="100%"></stop>
|
12
|
+
</linearGradient>
|
13
|
+
<linearGradient x1="50.2142662%" y1="27.5563585%" x2="49.5794007%" y2="93.5623381%" id="linearGradient-3">
|
14
|
+
<stop stop-color="#F7AAAB" offset="0%"></stop>
|
15
|
+
<stop stop-color="#F37A88" offset="100%"></stop>
|
16
|
+
</linearGradient>
|
17
|
+
</defs>
|
18
|
+
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
19
|
+
<g id="piecss" transform="translate(-1.000000, 0.000000)">
|
20
|
+
<path d="M34.015,56.502 L33.036,56.611 C33.036,56.611 19.086,55.715 11.363,44.779 C1.289,30.513 10.62,18.402 21.142,19.249 L25.145,12.149 C20.378,10.139 14.463,8.612 7.16,7.763 C-15.644,56.621 32.198,62.213 32.198,62.213 L36.669,62.91 L38.399,58.892 L34.015,56.502 Z" id="Shape" fill="url(#linearGradient-1)"></path>
|
21
|
+
<path d="M50.934,19.397 C61.91,17.509 72.33,29.986 61.883,44.779 C54.158,55.715 40.209,56.611 40.209,56.611 L39.232,56.502 L35.422,60.229 L36.576,62.912 L41.047,62.215 C41.047,62.215 88.888,56.623 66.084,7.765 C58.156,8.687 51.867,10.407 46.906,12.675 L50.934,19.397 Z" id="Shape" fill="url(#linearGradient-2)"></path>
|
22
|
+
<path d="M36.629,0.454 C-6.526,32.771 33.018,60.273 33.018,60.273 L36.629,63 L40.05,60.273 C40.051,60.273 82.066,32.012 36.629,0.454 Z M37.313,56.098 L36.4,55.732 C36.4,55.732 24.522,48.361 22.872,35.074 C19.628,8.951 52.948,7.944 50.377,35.244 C48.857,51.402 37.313,56.098 37.313,56.098 Z" id="Shape" fill="url(#linearGradient-3)"></path>
|
23
|
+
</g>
|
24
|
+
</g>
|
25
|
+
</svg>
|
@@ -4,11 +4,11 @@
|
|
4
4
|
<head>
|
5
5
|
<meta charset="utf-8" />
|
6
6
|
<title>Piecss - Test Markup</title>
|
7
|
-
<link href="
|
7
|
+
<link href="assets/css/screen.css" rel="stylesheet" media="screen">
|
8
8
|
<!-- <link href="./stylesheets/piecss.css" rel="stylesheet" media="screen"> -->
|
9
9
|
</head>
|
10
10
|
|
11
|
-
<body>
|
11
|
+
<body class="debug-grid">
|
12
12
|
|
13
13
|
<nav>
|
14
14
|
<a href="#headings">Headings</a> |
|
@@ -30,13 +30,10 @@
|
|
30
30
|
//
|
31
31
|
// ==========================================================================
|
32
32
|
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
//
|
37
|
-
|
38
|
-
$debug-rhythm: false;
|
39
|
-
|
33
|
+
$debug-columns: true;
|
34
|
+
$debug-rhythm: true;
|
35
|
+
$debug-breakpoint: true;
|
36
|
+
// $debug-grid: true;
|
40
37
|
|
41
38
|
// ==========================================================================
|
42
39
|
//
|
@@ -48,7 +45,7 @@ $debug-rhythm: false;
|
|
48
45
|
//
|
49
46
|
// ==========================================================================
|
50
47
|
|
51
|
-
@import "Compass";
|
48
|
+
// @import "Compass";
|
52
49
|
|
53
50
|
|
54
51
|
// ==========================================================================
|
@@ -60,7 +57,7 @@ $debug-rhythm: false;
|
|
60
57
|
//
|
61
58
|
// ==========================================================================
|
62
59
|
|
63
|
-
@import "piecss/utilities";
|
60
|
+
@import "sass/piecss/utilities";
|
64
61
|
|
65
62
|
|
66
63
|
// ==========================================================================
|
@@ -72,7 +69,7 @@ $debug-rhythm: false;
|
|
72
69
|
//
|
73
70
|
// ==========================================================================
|
74
71
|
|
75
|
-
@import "piecss/settings";
|
72
|
+
@import "sass/piecss/settings";
|
76
73
|
@import "settings";
|
77
74
|
|
78
75
|
|
@@ -96,7 +93,7 @@ $debug-rhythm: false;
|
|
96
93
|
//
|
97
94
|
// ==========================================================================
|
98
95
|
|
99
|
-
@import "piecss/behavior";
|
96
|
+
@import "sass/piecss/behavior";
|
100
97
|
|
101
98
|
// Or, import individually:
|
102
99
|
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: piecss
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.
|
4
|
+
version: 0.7.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Babs Gosgens
|
@@ -33,107 +33,67 @@ extra_rdoc_files: []
|
|
33
33
|
files:
|
34
34
|
- README.md
|
35
35
|
- lib/piecss.rb
|
36
|
-
- sass/piecss/_behavior.css
|
37
|
-
- sass/piecss/_behavior.css.map
|
38
36
|
- sass/piecss/_behavior.scss
|
39
|
-
- sass/piecss/_settings.css
|
40
|
-
- sass/piecss/_settings.css.map
|
41
37
|
- sass/piecss/_settings.scss
|
42
|
-
- sass/piecss/_utilities.css
|
43
|
-
- sass/piecss/_utilities.css.map
|
44
38
|
- sass/piecss/_utilities.scss
|
45
39
|
- sass/piecss/behavior/anchor/_anchor.scss
|
40
|
+
- sass/piecss/behavior/anchor/_settings.scss
|
46
41
|
- sass/piecss/behavior/base/_base.scss
|
47
42
|
- sass/piecss/behavior/base/_collection.scss
|
48
43
|
- sass/piecss/behavior/base/_settings.scss
|
49
44
|
- sass/piecss/behavior/button/_button.scss
|
50
45
|
- sass/piecss/behavior/button/_settings.scss
|
46
|
+
- sass/piecss/behavior/debug/_behavior.scss
|
47
|
+
- sass/piecss/behavior/debug/_mixins.scss
|
48
|
+
- sass/piecss/behavior/debug/_settings.scss
|
51
49
|
- sass/piecss/behavior/form/_form.scss
|
52
50
|
- sass/piecss/behavior/form/_settings.scss
|
51
|
+
- sass/piecss/behavior/is/_collection.scss
|
52
|
+
- sass/piecss/behavior/is/_settings.scss
|
53
|
+
- sass/piecss/behavior/layout/_bleed.scss
|
54
|
+
- sass/piecss/behavior/layout/_chain.scss
|
55
|
+
- sass/piecss/behavior/layout/_column.scss
|
53
56
|
- sass/piecss/behavior/layout/_grid.scss
|
57
|
+
- sass/piecss/behavior/layout/_gutters.scss
|
54
58
|
- sass/piecss/behavior/layout/_layout.scss
|
55
|
-
- sass/piecss/behavior/layout/
|
59
|
+
- sass/piecss/behavior/layout/_leader.scss
|
60
|
+
- sass/piecss/behavior/layout/_trailer.scss
|
61
|
+
- sass/piecss/behavior/layout/_wings.scss
|
56
62
|
- sass/piecss/behavior/list/_list.scss
|
57
63
|
- sass/piecss/behavior/list/_settings.scss
|
58
|
-
- sass/piecss/settings/_breakpoint.css
|
59
64
|
- sass/piecss/settings/_breakpoint.scss
|
60
|
-
- sass/piecss/settings/_colour.css
|
61
|
-
- sass/piecss/settings/_colour.css.map
|
62
65
|
- sass/piecss/settings/_colour.scss
|
63
|
-
- sass/piecss/settings/_constants.css
|
64
|
-
- sass/piecss/settings/_constants.css.map
|
65
66
|
- sass/piecss/settings/_constants.scss
|
66
|
-
- sass/piecss/settings/_fallback.css
|
67
|
-
- sass/piecss/settings/_fallback.css.map
|
68
|
-
- sass/piecss/settings/_fallback.scss
|
69
|
-
- sass/piecss/settings/_font.css
|
70
|
-
- sass/piecss/settings/_font.css.map
|
71
67
|
- sass/piecss/settings/_font.scss
|
72
|
-
- sass/piecss/settings/
|
73
|
-
- sass/piecss/settings/
|
74
|
-
- sass/piecss/settings/_miscellaneous.css
|
75
|
-
- sass/piecss/settings/_miscellaneous.css.map
|
68
|
+
- sass/piecss/settings/_grid.scss
|
69
|
+
- sass/piecss/settings/_legacy.scss
|
76
70
|
- sass/piecss/settings/_miscellaneous.scss
|
77
|
-
- sass/piecss/settings/_rhythm.css
|
78
|
-
- sass/piecss/settings/_rhythm.css.map
|
79
71
|
- sass/piecss/settings/_rhythm.scss
|
80
|
-
- sass/piecss/settings/_typography.css
|
81
|
-
- sass/piecss/settings/_typography.css.map
|
82
72
|
- sass/piecss/settings/_typography.scss
|
83
|
-
- sass/piecss/settings/_unit.css
|
84
|
-
- sass/piecss/settings/_unit.css.map
|
85
73
|
- sass/piecss/settings/_unit.scss
|
86
74
|
- sass/piecss/settings/fonts/_example.scss
|
87
75
|
- sass/piecss/settings/fonts/_monospace.scss
|
88
76
|
- sass/piecss/settings/fonts/_sans-serif.scss
|
89
77
|
- sass/piecss/settings/fonts/_serif.scss
|
90
|
-
- sass/piecss/settings/fonts/_verdana.scss
|
91
|
-
- sass/piecss/utilities/_breakpoint.css
|
92
|
-
- sass/piecss/utilities/_breakpoint.css.map
|
93
78
|
- sass/piecss/utilities/_breakpoint.scss
|
94
|
-
- sass/piecss/utilities/_cache.css
|
95
|
-
- sass/piecss/utilities/_cache.css.map
|
96
|
-
- sass/piecss/utilities/_cache.scss
|
97
79
|
- sass/piecss/utilities/_collection.scss
|
98
|
-
- sass/piecss/utilities/_colour.css
|
99
|
-
- sass/piecss/utilities/_colour.css.map
|
100
80
|
- sass/piecss/utilities/_colour.scss
|
101
|
-
- sass/piecss/utilities/
|
102
|
-
- sass/piecss/utilities/_element.css.map
|
103
|
-
- sass/piecss/utilities/_image.css
|
104
|
-
- sass/piecss/utilities/_image.css.map
|
81
|
+
- sass/piecss/utilities/_grid.scss
|
105
82
|
- sass/piecss/utilities/_image.scss
|
106
|
-
- sass/piecss/utilities/
|
107
|
-
- sass/piecss/utilities/_layout.css.map
|
108
|
-
- sass/piecss/utilities/_layout.scss
|
109
|
-
- sass/piecss/utilities/_list.css
|
110
|
-
- sass/piecss/utilities/_list.css.map
|
111
|
-
- sass/piecss/utilities/_list.scss
|
112
|
-
- sass/piecss/utilities/_miscellaneous.css
|
113
|
-
- sass/piecss/utilities/_miscellaneous.css.map
|
83
|
+
- sass/piecss/utilities/_legacy.scss
|
114
84
|
- sass/piecss/utilities/_miscellaneous.scss
|
115
|
-
- sass/piecss/utilities/_rhythm.css
|
116
|
-
- sass/piecss/utilities/_rhythm.css.map
|
117
85
|
- sass/piecss/utilities/_rhythm.scss
|
118
|
-
- sass/piecss/utilities/_side.css
|
119
|
-
- sass/piecss/utilities/_side.css.map
|
120
|
-
- sass/piecss/utilities/_side.scss
|
121
|
-
- sass/piecss/utilities/_string.css
|
122
|
-
- sass/piecss/utilities/_string.css.map
|
123
86
|
- sass/piecss/utilities/_string.scss
|
124
|
-
- sass/piecss/utilities/_svg.css
|
125
|
-
- sass/piecss/utilities/_svg.css.map
|
126
87
|
- sass/piecss/utilities/_svg.scss
|
127
|
-
- sass/piecss/utilities/_typography.css
|
128
|
-
- sass/piecss/utilities/_typography.css.map
|
129
88
|
- sass/piecss/utilities/_typography.scss
|
130
|
-
- sass/piecss/utilities/_unit.css
|
131
|
-
- sass/piecss/utilities/_unit.css.map
|
132
89
|
- sass/piecss/utilities/_unit.scss
|
133
90
|
- templates/project/_sets/_button.scss
|
134
91
|
- templates/project/_sets/_form.scss
|
135
92
|
- templates/project/_sets.scss
|
136
93
|
- templates/project/_settings.scss
|
94
|
+
- templates/project/assets/css/screen.css
|
95
|
+
- templates/project/assets/images/piecss.png
|
96
|
+
- templates/project/assets/images/piecss.svg
|
137
97
|
- templates/project/examples.html
|
138
98
|
- templates/project/manifest.rb
|
139
99
|
- templates/project/screen.scss
|
@@ -1,7 +0,0 @@
|
|
1
|
-
{
|
2
|
-
"version": 3,
|
3
|
-
"mappings": "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",
|
4
|
-
"sources": ["settings/_colour.scss","_behavior.scss","behavior/base/_collection.scss","utilities/_collection.scss","utilities/_unit.scss","settings/fonts/_sans-serif.scss","behavior/base/_settings.scss","behavior/layout/_rhythm.scss","behavior/form/_form.scss","behavior/form/_settings.scss","behavior/button/_button.scss"],
|
5
|
-
"names": [],
|
6
|
-
"file": "_behavior.css"
|
7
|
-
}
|
data/sass/piecss/_settings.css
DELETED