piecss 0.6.0 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (104) hide show
  1. checksums.yaml +4 -4
  2. data/sass/piecss/_behavior.scss +5 -0
  3. data/sass/piecss/_settings.scss +2 -2
  4. data/sass/piecss/_utilities.scss +2 -4
  5. data/sass/piecss/behavior/anchor/_anchor.scss +7 -21
  6. data/sass/piecss/behavior/anchor/_settings.scss +11 -0
  7. data/sass/piecss/behavior/base/_base.scss +0 -1
  8. data/sass/piecss/behavior/base/_collection.scss +3 -3
  9. data/sass/piecss/behavior/base/_settings.scss +1 -1
  10. data/sass/piecss/behavior/debug/_behavior.scss +22 -0
  11. data/sass/piecss/behavior/debug/_mixins.scss +127 -0
  12. data/sass/piecss/behavior/debug/_settings.scss +81 -0
  13. data/sass/piecss/behavior/is/_collection.scss +57 -0
  14. data/sass/piecss/behavior/is/_settings.scss +12 -0
  15. data/sass/piecss/behavior/layout/_bleed.scss +23 -0
  16. data/sass/piecss/behavior/layout/_chain.scss +45 -0
  17. data/sass/piecss/behavior/layout/_column.scss +14 -0
  18. data/sass/piecss/behavior/layout/_grid.scss +13 -3
  19. data/sass/piecss/behavior/layout/_gutters.scss +32 -0
  20. data/sass/piecss/behavior/layout/_layout.scss +29 -29
  21. data/sass/piecss/behavior/layout/_leader.scss +57 -0
  22. data/sass/piecss/behavior/layout/_trailer.scss +57 -0
  23. data/sass/piecss/behavior/layout/_wings.scss +122 -0
  24. data/sass/piecss/behavior/list/_list.scss +134 -175
  25. data/sass/piecss/behavior/list/_settings.scss +9 -31
  26. data/sass/piecss/settings/_colour.scss +10 -1
  27. data/sass/piecss/settings/_font.scss +0 -1
  28. data/sass/piecss/settings/_grid.scss +119 -0
  29. data/sass/piecss/settings/_legacy.scss +24 -0
  30. data/sass/piecss/settings/_rhythm.scss +0 -10
  31. data/sass/piecss/utilities/_collection.scss +5 -1
  32. data/sass/piecss/utilities/_colour.scss +3 -3
  33. data/sass/piecss/utilities/_grid.scss +355 -0
  34. data/sass/piecss/utilities/_legacy.scss +42 -0
  35. data/sass/piecss/utilities/_miscellaneous.scss +8 -82
  36. data/sass/piecss/utilities/_rhythm.scss +7 -36
  37. data/sass/piecss/utilities/_typography.scss +8 -98
  38. data/templates/project/_sets.scss +2 -3
  39. data/templates/project/_settings.scss +26 -27
  40. data/{sass/piecss/_behavior.css → templates/project/assets/css/screen.css} +100 -5
  41. data/templates/project/assets/images/piecss.png +0 -0
  42. data/templates/project/assets/images/piecss.svg +25 -0
  43. data/templates/project/examples.html +2 -2
  44. data/templates/project/screen.scss +8 -11
  45. metadata +21 -61
  46. data/sass/piecss/_behavior.css.map +0 -7
  47. data/sass/piecss/_settings.css +0 -2
  48. data/sass/piecss/_settings.css.map +0 -7
  49. data/sass/piecss/_utilities.css +0 -3
  50. data/sass/piecss/_utilities.css.map +0 -7
  51. data/sass/piecss/behavior/layout/_rhythm.scss +0 -21
  52. data/sass/piecss/settings/_breakpoint.css +0 -70
  53. data/sass/piecss/settings/_colour.css +0 -2
  54. data/sass/piecss/settings/_colour.css.map +0 -7
  55. data/sass/piecss/settings/_constants.css +0 -2
  56. data/sass/piecss/settings/_constants.css.map +0 -7
  57. data/sass/piecss/settings/_fallback.css +0 -2
  58. data/sass/piecss/settings/_fallback.css.map +0 -7
  59. data/sass/piecss/settings/_fallback.scss +0 -15
  60. data/sass/piecss/settings/_font.css +0 -2
  61. data/sass/piecss/settings/_font.css.map +0 -7
  62. data/sass/piecss/settings/_layout.css +0 -60
  63. data/sass/piecss/settings/_layout.scss +0 -168
  64. data/sass/piecss/settings/_miscellaneous.css +0 -2
  65. data/sass/piecss/settings/_miscellaneous.css.map +0 -7
  66. data/sass/piecss/settings/_rhythm.css +0 -2
  67. data/sass/piecss/settings/_rhythm.css.map +0 -7
  68. data/sass/piecss/settings/_typography.css +0 -2
  69. data/sass/piecss/settings/_typography.css.map +0 -7
  70. data/sass/piecss/settings/_unit.css +0 -2
  71. data/sass/piecss/settings/_unit.css.map +0 -7
  72. data/sass/piecss/settings/fonts/_verdana.scss +0 -40
  73. data/sass/piecss/utilities/_breakpoint.css +0 -2
  74. data/sass/piecss/utilities/_breakpoint.css.map +0 -7
  75. data/sass/piecss/utilities/_cache.css +0 -2
  76. data/sass/piecss/utilities/_cache.css.map +0 -7
  77. data/sass/piecss/utilities/_cache.scss +0 -78
  78. data/sass/piecss/utilities/_colour.css +0 -2
  79. data/sass/piecss/utilities/_colour.css.map +0 -7
  80. data/sass/piecss/utilities/_element.css +0 -2
  81. data/sass/piecss/utilities/_element.css.map +0 -7
  82. data/sass/piecss/utilities/_image.css +0 -2
  83. data/sass/piecss/utilities/_image.css.map +0 -7
  84. data/sass/piecss/utilities/_layout.css +0 -2
  85. data/sass/piecss/utilities/_layout.css.map +0 -7
  86. data/sass/piecss/utilities/_layout.scss +0 -570
  87. data/sass/piecss/utilities/_list.css +0 -2
  88. data/sass/piecss/utilities/_list.css.map +0 -7
  89. data/sass/piecss/utilities/_list.scss +0 -26
  90. data/sass/piecss/utilities/_miscellaneous.css +0 -2
  91. data/sass/piecss/utilities/_miscellaneous.css.map +0 -7
  92. data/sass/piecss/utilities/_rhythm.css +0 -2
  93. data/sass/piecss/utilities/_rhythm.css.map +0 -7
  94. data/sass/piecss/utilities/_side.css +0 -2
  95. data/sass/piecss/utilities/_side.css.map +0 -7
  96. data/sass/piecss/utilities/_side.scss +0 -370
  97. data/sass/piecss/utilities/_string.css +0 -2
  98. data/sass/piecss/utilities/_string.css.map +0 -7
  99. data/sass/piecss/utilities/_svg.css +0 -2
  100. data/sass/piecss/utilities/_svg.css.map +0 -7
  101. data/sass/piecss/utilities/_typography.css +0 -2
  102. data/sass/piecss/utilities/_typography.css.map +0 -7
  103. data/sass/piecss/utilities/_unit.css +0 -2
  104. 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
- // @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);
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 parameter should either be a space separated list, or property map
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 parameter should either be a space separated list, or property map
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 parameter should either be a space separated list, or property map
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 parameter should either be a space separated list, or property map
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
- @include font-size($font-size, 1px);
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,7 +1,6 @@
1
- /*
2
1
  /// Copyright (C) 2014 Babs Gösgens. All rights reserved.
3
2
  /// Licensed under MIT; see LICENSE.txt
4
3
  ///
5
4
 
6
- @import "elements/form";
7
- @import "elements/button";
5
+ // @import "elements/form";
6
+ // @import "elements/button";
@@ -1,29 +1,28 @@
1
- /*
2
- /// Copyright (C) 2014 Babs Gösgens. All rights reserved.
3
- /// Licensed under MIT; see LICENSE.txt
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
- $small_handheld: (main: 1/1, side: 1/1),
9
- $small_desktop: (main: 2/3, side: 1/3),
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
- $small_handheld: (
15
- columns: 4,
16
- color: $orange,
17
- pages: (),
18
- ),
19
- $medium_handheld: (
20
- columns: 8,
21
- color: $cyan,
22
- pages: (),
23
- ),
24
- $small_desktop: (
25
- columns: 12,
26
- color: $becca,
27
- pages: (),
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
- Debug helpers
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
- /*# sourceMappingURL=_behavior.css.map */
523
+ /*
524
+ @import "piecss/behavior/base";
525
+ @import "piecss/behavior/grid";
526
+ @import "piecss/behavior/form";
527
+ @import "piecss/behavior/list";
528
+ */
@@ -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="../../sass/piecss/_behavior.css" rel="stylesheet" media="screen">
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>&nbsp;&nbsp;|&nbsp;&nbsp;
@@ -30,13 +30,10 @@
30
30
  //
31
31
  // ==========================================================================
32
32
 
33
-
34
- // ==========================================================================
35
- // $debug-rhythm - If true, will show vertical rhythm
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.6.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/_rhythm.scss
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/_layout.css
73
- - sass/piecss/settings/_layout.scss
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/_element.css
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/_layout.css
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
- }
@@ -1,2 +0,0 @@
1
-
2
- /*# sourceMappingURL=_settings.css.map */