singularitygs 1.1.2 → 1.8.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 (49) hide show
  1. checksums.yaml +7 -7
  2. data/lib/singularitygs.rb +14 -6
  3. data/stylesheets/_singularitygs.scss +21 -30
  4. data/stylesheets/singularitygs/_api.scss +103 -24
  5. data/stylesheets/singularitygs/_css-grid.scss +141 -0
  6. data/stylesheets/singularitygs/_helpers.scss +6 -2
  7. data/stylesheets/singularitygs/api/_calc.scss +218 -0
  8. data/stylesheets/singularitygs/api/_float.scss +87 -147
  9. data/stylesheets/singularitygs/api/_isolation.scss +98 -131
  10. data/stylesheets/singularitygs/grids/_add.scss +34 -16
  11. data/stylesheets/singularitygs/grids/_find.scss +6 -8
  12. data/stylesheets/singularitygs/gutter-styles/_add.scss +39 -16
  13. data/stylesheets/singularitygs/gutter-styles/_find.scss +10 -5
  14. data/stylesheets/singularitygs/gutter-styles/_helpers.scss +6 -10
  15. data/stylesheets/singularitygs/gutters/_add.scss +37 -14
  16. data/stylesheets/singularitygs/gutters/_find.scss +9 -5
  17. data/stylesheets/singularitygs/helpers/_background-grid.scss +196 -219
  18. data/stylesheets/singularitygs/helpers/_box-sizing.scss +17 -32
  19. data/stylesheets/singularitygs/helpers/_clearfix.scss +10 -95
  20. data/stylesheets/singularitygs/helpers/_columns.scss +4 -3
  21. data/stylesheets/singularitygs/helpers/_directions.scss +6 -0
  22. data/stylesheets/singularitygs/helpers/_find.scss +112 -65
  23. data/stylesheets/singularitygs/helpers/_layout.scss +107 -10
  24. data/stylesheets/singularitygs/helpers/_sass-lists.scss +1 -1
  25. data/stylesheets/singularitygs/helpers/_settings.scss +60 -0
  26. data/stylesheets/singularitygs/helpers/_sort.scss +56 -0
  27. data/stylesheets/singularitygs/helpers/_span-shared.scss +20 -2
  28. data/stylesheets/singularitygs/language/_parse-add.scss +53 -9
  29. data/stylesheets/singularitygs/language/_parse-list.scss +3 -3
  30. data/stylesheets/singularitygs/math/_columns.scss +9 -7
  31. data/stylesheets/singularitygs/math/_context.scss +1 -1
  32. data/stylesheets/singularitygs/math/_gutters.scss +2 -1
  33. metadata +52 -72
  34. data/templates/box-sizing/behaviors/box-sizing/boxsizing.htc +0 -399
  35. data/templates/box-sizing/behaviors/box-sizing/boxsizing.php +0 -23
  36. data/templates/box-sizing/manifest.rb +0 -4
  37. data/templates/demos/demo-float.scss +0 -159
  38. data/templates/demos/demo-isolation.scss +0 -132
  39. data/templates/demos/float.html.erb +0 -18
  40. data/templates/demos/isolation.html.erb +0 -18
  41. data/templates/demos/manifest.rb +0 -17
  42. data/templates/grid-toggle/grid.js +0 -16
  43. data/templates/grid-toggle/grid.min.js +0 -2
  44. data/templates/grid-toggle/manifest.rb +0 -22
  45. data/templates/project/grid.js +0 -16
  46. data/templates/project/grid.min.js +0 -2
  47. data/templates/project/manifest.rb +0 -23
  48. data/templates/project/partials/_base.scss +0 -4
  49. data/templates/project/style.scss +0 -15
data/stylesheets/singularitygs/helpers/_background-grid.scss CHANGED
@@ -1,269 +1,246 @@
1
1
  // -----------------------------------------------
2
- // Grid Overlay & Background
3
- //
4
- // Uses all your settings to create a grid background for a container element.
5
- // There are three ways you can display a grid:
6
- //
7
- // 1. Manually apply the background to the element -
8
- //
9
- // .container {
10
- // @include background-grid;
11
- // }
12
- //
13
- // 2. Add a switch to toggle an overlay -
14
- //
15
- // @include grid-overlay('.container');
16
- //
17
- // 3. Toggle grid with JavaScript
18
- //
19
- // @include grid-toggle;
20
- // Add [data-development-grid="show"] to item you want grid applied to
21
- // Add "grid.min.js" to your HTML
22
- //
23
- // The first will apply a grid background to your container calculated using your
24
- // grid settings, media breakpoints etc.
25
- //
26
- // The second will add a switch to your page which allows you to view a grid
27
- // overlay over your container (or <body> if none is provided) by hovering over
28
- // the switch. if you need your mouse for other things you can toggle the overlay
29
- // on permanently by inspecting <head> and checking :hover in your styles panel.
30
- //
31
- // The thid will allow you to toggle your background grid on and off by pressing the 'g' on your keyboard.
32
- //
33
- // Note: Sub-pixel rounding can lead to several pixels of variation between browsers.
34
-
35
-
36
- // -----------------------------------------------
37
- // Imports
38
- @import "compass/css3";
39
-
40
- // -----------------------------------------------
41
- // Grid Overlay
42
-
43
- // The overlay is painted over your container's ::after pseudo-element, so we must
44
- // give position to the container itself, if relative doesn't suit your layout
45
- // it can be replaced by absolute/fixed.
46
- $overlay-position: relative !default;
47
-
48
- // Set the position of the switch.
49
- $overlay-switch-position: left bottom !default;
2
+ // Grid Background
50
3
 
51
- $background-grid-color: Chocolate !default;
4
+ @mixin background-grid(
5
+ $columns: null,
6
+ $gutter: null,
7
+ $gutter-style: null,
8
+ $color: null
9
+ ) {
52
10
 
53
- // Global variable to show or hide the grid background at will.
54
- $show-grid-backgrounds: true !default;
11
+ $color: if($color != null, $color, sgs-get('background grid color'));
55
12
 
56
- @mixin grid-overlay (
57
- $selector: 'body',
58
- $columns: false,
59
- $gutter: false,
60
- $color: $background-grid-color
61
- ) {
13
+ @if sgs-get('debug') != false {
14
+ $columns: if($columns != null, $columns, sgs-get('grids'));
15
+ $gutter: if($gutter != null, $gutter, sgs-get('gutters'));
16
+ $gutter-style: if($gutter-style != null, $gutter-style, sgs-get('gutter styles'));
62
17
 
63
- $vert: nth($overlay-switch-position, 1);
64
- $horz: nth($overlay-switch-position, 2);
65
-
66
- head {
67
- display: block;
68
- position: fixed;
69
- #{$horz}: 10px;
70
- #{$vert}: 10px;
71
- z-index: 99;
72
- color: #333;
73
- text-shadow: 0 0 3px #fff;
74
- @include transition(all .4s);
75
- &::before {
76
- content: "||||";
77
- display: block;
78
- padding: 10px 14px;
79
- letter-spacing: -1;
80
- font: {
81
- family: sans-serif;
82
- size: 26px;
83
- weight: bold;
84
- }
85
- }
86
- &:hover {
87
- color: #333;
88
- text-shadow: 1px 1px #fff;
89
- ~ body #{$selector} {
90
- position: unquote($overlay-position);
91
- }
92
- ~ #{$selector}::after,
93
- ~ body #{$selector}::after {
94
- content: " ";
95
- position: absolute;
96
- top: 0;
97
- left: 0;
98
- right: 0;
99
- bottom: 0;
100
- height: 100%;
101
- width: 100%;
102
- @include background-grid($columns, $gutter, $color);
103
- }
104
- }
18
+ @include background-build($columns, $gutter, $gutter-style, $color)
105
19
  }
106
20
  }
107
21
 
108
- // -----------------------------------------------
109
- // Grid Toggle
110
-
111
- @mixin grid-toggle(
112
- $columns: false,
113
- $gutter: false,
114
- $color: $background-grid-color
115
- ) {
22
+ @function background-map($columns, $gutters, $gutter-styles) {
23
+ $Grids: ();
24
+ $Gutters: ();
25
+ $Styles: ();
116
26
 
117
- [data-development-grid="show"] {
118
- @include background-grid($columns, $gutter, $color);
27
+ @if $columns and type-of($columns) != 'map' {
28
+ $Grids: (-1px: $columns);
29
+ }
30
+ @else {
31
+ $Grids: sgs-get('grids');
119
32
  }
120
- }
121
33
 
122
- // -----------------------------------------------
123
- // Grid Background
34
+ @if $gutters and type-of($gutters) != 'map' {
35
+ $Gutters: (-1px: $gutters);
36
+ }
37
+ @else {
38
+ $Gutters: sgs-get('gutters');
39
+ }
124
40
 
125
- @mixin background-grid(
126
- $columns: false,
127
- $gutter: false,
128
- $color: $background-grid-color
129
- ) {
41
+ @if $gutter-styles and type-of($gutter-styles) != 'map' {
42
+ $Styles: (-1px: $gutter-styles);
43
+ }
44
+ @else {
45
+ $Styles: sgs-get('gutter styles');
46
+ }
130
47
 
131
- @if $show-grid-backgrounds {
132
- $background-length: length($grids);
48
+ // Build 1st Depth Map
49
+ $Holder: ();
133
50
 
134
- @if (not $columns) {
135
- $grid: find-grid($columns);
136
- @include background-build($grid, $gutter, $color);
137
- @if ($grid != $grids) {
138
- @for $i from 2 through $background-length {
139
- $mq: nth(nth($grids, $i), 2);
140
- $grid: nth(nth($grids, $i), 1);
51
+ // Grids
52
+ @each $k, $v in $Grids {
53
+ $Holder: map-merge($Holder, ($k: ('grid': $v)));
54
+ }
55
+ // Gutters
56
+ @each $k, $v in $Gutters {
57
+ $Grid: map-get($Holder, $k);
58
+
59
+ $Map: ('gutter': $v);
60
+ @if $Grid != null {
61
+ $Grid: map-get($Grid, 'grid');
62
+ @if $Grid != null {
63
+ $Map: map-merge($Map, ('grid': $Grid));
64
+ }
65
+ }
141
66
 
142
- @include breakpoint($mq) {
143
- @include background-build($grid, $gutter, $color);
144
- }
145
- }
67
+ $Holder: map-merge($Holder, ($k: $Map));
68
+ }
69
+ // Style
70
+ @each $k, $v in $Styles {
71
+ $Grid: map-get($Holder, $k);
72
+ $Gutter: map-get($Holder, $k);
73
+
74
+ $Map: ('style': $v);
75
+ @if $Grid != null {
76
+ $Grid: map-get($Grid, 'grid');
77
+ @if $Grid != null {
78
+ $Map: map-merge($Map, ('grid': $Grid));
146
79
  }
147
80
  }
148
- @else {
149
- @include background-build($columns, $gutter, $color);
81
+ @if $Gutter != null {
82
+ $Gutter: map-get($Gutter, 'gutter');
83
+ @if $Gutter != null {
84
+ $Map: map-merge($Map, ('gutter': $Gutter));
85
+ }
150
86
  }
151
87
 
152
-
88
+ $Holder: map-merge($Holder, ($k: $Map));
153
89
  }
154
- }
155
-
156
- @mixin background-build($columns, $gutter, $color) {
157
- $columns: find-grid($columns);
158
- $gutter: find-gutter($gutter);
159
90
 
160
- $gutter-style: find-gutter-style();
161
- $fixed-gutter: fixed-gutter($columns, $gutter);
162
- $split: index($gutter-style, split);
91
+ $Holder: sort-map($Holder);
92
+ $Return: ();
163
93
 
164
- $widths: ();
165
- $colors: ();
94
+ // Build full stack for each breakpoint
95
+ @for $i from 1 through length($Holder) {
96
+ $Key: nth(nth($Holder, $i), 1);
97
+ $Value: nth(nth($Holder, $i), 2);
166
98
 
167
- $length: length($columns);
168
- $symmetric: false;
169
- @if type-of($columns) == 'number' or $length == 1 {
170
- $symmetric: true;
171
- $length: nth($columns, 1);
172
- }
173
-
174
- @for $i from 1 through $length {
175
-
176
- @if ($fixed-gutter or $gutter == 0) and $i % 2 == 0 {
177
- $color: darken($color, 15%);
178
- }
179
- @else if ($fixed-gutter or $gutter == 0) and $i % 2 == 1 {
180
- $color: lighten($color, 15%);
99
+ $Previous: ();
100
+ @if $i > 1 {
101
+ $Previous: nth(nth($Return, $i - 1), 2);
181
102
  }
182
103
 
183
- $column-span: column-span($i, 1, $columns);
184
- $gutter-span: 0;
185
- @if $fixed-gutter {
186
- $gutter-span: $column-span;
187
- }
188
- @else {
189
- $gutter-span: $column-span + gutter-span($gutter, $columns);
104
+ @if not map-has-key($Value, 'grid') {
105
+ $Sort-Grid: map-get($Previous, 'grid');
106
+ $Value: map-merge($Value, ('grid': $Sort-Grid));
190
107
  }
191
108
 
192
- @if $i == 1 and $split and not $fixed-gutter {
193
- $widths: append($widths, gutter-span($gutter, $columns) / 2);
194
- $colors: append($colors, rgba($color, .25));
109
+ @if not map-has-key($Value, 'gutter') {
110
+ $Sort-Gutter: map-get($Previous, 'gutter');
111
+ $Value: map-merge($Value, ('gutter': $Sort-Gutter));
195
112
  }
196
113
 
197
- @if $i != $columns {
198
- $widths: append($widths, $column-span);
199
- $colors: append($colors, rgba($color, .5));
200
- $widths: append($widths, $gutter-span);
201
- $colors: append($colors, rgba($color, .25));
202
- }
203
- @else {
204
- $widths: append($widths, $column-span);
205
- $colors: append($colors, rgba($color, .5));
114
+ @if not map-has-key($Value, 'style') {
115
+ $Sort-Style: map-get($Previous, 'style');
116
+ $Value: map-merge($Value, ('style': $Sort-Style));
206
117
  }
207
118
 
208
- @if $i == $length and $split and not $fixed-gutter {
209
- $widths: append($widths, $column-span + gutter-span($gutter, $columns) / 2);
210
- $colors: append($colors, rgba($color, .25));
211
- }
119
+ $Return: map-merge($Return, ($Key: $Value));
212
120
  }
213
121
 
214
- @include background-gradient-generate($widths, $colors);
215
-
122
+ @return $Return;
216
123
  }
217
124
 
218
- //////////////////////////////
219
- // Get the columns
220
- //////////////////////////////
221
- @mixin background-gradient-generate($widths, $colors, $direction: left) {
222
- @if (length($widths) != length($colors)) and (length($widths) != length($colors) - 1) {
223
- @warn 'You either need an equal number of widths and colors or one less width than color, in which case it is assumed that the last width goes to 100%. Please provide the correct amount of widths and colors.';
224
- }
225
- @else {
226
- $stops: ();
125
+ @mixin background-build($columns, $gutters, $gutter-styles, $color) {
126
+ $Background-Map: background-map($columns, $gutters, $gutter-styles);
127
+ $Display: true;
128
+
129
+ $Column-Color: $color;
130
+ $Inverse-Column-Color: mix(black, $color, 15%);
131
+ $Gutter-Color: mix(white, $color, 25%);
132
+ $Direction: named-direction(sgs-get('direction'));
133
+
134
+ $encodeMap:(
135
+ '%"':'%25%22',
136
+ '<':'%3C',
137
+ ' ':'%20',
138
+ '=':'%3D',
139
+ '\"':'%22',
140
+ ':':'%3A',
141
+ '/':'%2F',
142
+ '.':'%2E',
143
+ '>':'%3E',
144
+ '#':'%23',
145
+ '-':'%2D'
146
+ );
147
+
148
+ @each $bkpt, $def in $Background-Map {
149
+ $Grid: map-get($def, 'grid');
150
+ $Gutter: map-get($def, 'gutter');
151
+ $Style: map-get($def, 'style');
152
+
153
+ $Grid-Count: column-count($Grid);
154
+
155
+ $SVG: '<svg xmlns="http://www.w3.org/2000/svg">';
156
+
157
+ $Gutter-Width: gutter-span($Gutter, $Grid, $Style);
158
+ @if unit($Gutter-Width) != '%' and unit($Gutter-Width) != '' {
159
+ $Gutter-Width: 0%;
160
+ }
227
161
 
228
- @if length($widths) == (length($colors) - 1) {
229
- $widths: append($widths, 100%);
162
+ @if $Style == 'fixed' {
163
+ $Gutter-Width: 0%;
230
164
  }
165
+ $Counter-Width: 0%;
166
+ $holder: ();
231
167
 
232
- $i: 1;
168
+ @for $i from 1 through $Grid-Count {
169
+ $Holder-Gradient: ();
170
+ $Loop-Width: column-span(1, $i, $Grid, $Gutter, $Style);
233
171
 
234
- @each $width in $widths {
235
- $width: nth($widths, $i);
236
- $color: nth($colors, $i);
172
+ @if index($Style, 'split') and $i == 1 {
173
+ $SVG: $SVG + '<rect x="#{$Counter-Width}" fill="#{$Gutter-Color}" width="#{$Gutter-Width / 2}" height="100%"/>';
174
+ $Counter-Width: ($Gutter-Width / 2);
175
+ }
237
176
 
238
- @if $i == 1 {
239
- $stops: join($stops, build-gradient-piece($width, $color), comma);
177
+ $Loop-Color: $Column-Color;
178
+ @if (index($Style, 'fixed') or $Gutter-Width == 0%) and ($i % 2 == 0 ) {
179
+ $Loop-Color: $Inverse-Column-Color;
240
180
  }
241
- @else {
242
- $position: nth($widths, $i - 1);
243
- $stops: join($stops, build-gradient-piece($width, $color, $position), comma);
181
+
182
+ @if $i != $Grid-Count {
183
+ @if unit($Counter-Width) == unit($Loop-Width) {
184
+ $SVG: $SVG + '<rect x="#{$Counter-Width}" fill="#{$Loop-Color}" width="#{$Loop-Width}" height="100%"/>';
185
+ $Counter-Width: $Counter-Width + $Loop-Width;
186
+ $SVG: $SVG + '<rect x="#{$Counter-Width}" fill="#{$Gutter-Color}" width="#{$Gutter-Width}" height="100%"/>';
187
+ $Counter-Width: $Counter-Width + $Gutter-Width;
188
+ }
189
+ @else {
190
+ $Display: false;
191
+ }
192
+
244
193
  }
194
+ @else if $i == 1 {
195
+ @if unit($Counter-Width) == unit($Loop-Width) {
196
+ $SVG: $SVG + '<rect x="#{$Counter-Width}" fill="#{$Loop-Color}" width="#{$Loop-Width}" height="100%"/>';
197
+ $SVG: $SVG + '<rect x="#{$Loop-Width}" fill="#{$Gutter-Color}" width="#{$Gutter-Width}" height="100%"/>';
198
+ $Counter-Width: $Counter-Width + $Loop-Width + $Gutter-Width;
199
+ }
200
+ @else {
201
+ $Display: false;
202
+ }
245
203
 
246
- $i: $i + 1;
204
+ }
205
+ @else if $i == $Grid-Count and index($Style, 'split') {
206
+ @if unit($Counter-Width) == unit($Loop-Width) {
207
+ $SVG: $SVG + '<rect x="#{$Counter-Width}" fill="#{$Loop-Color}" width="#{$Loop-Width}" height="100%"/>';
208
+ $Counter-Width: $Counter-Width + $Loop-Width;
209
+ $SVG: $SVG + '<rect x="#{$Counter-Width}" fill="#{$Gutter-Color}" width="#{$Gutter-Width / 2}" height="100%"/>';
210
+ }
211
+ @else {
212
+ $Display: false;
213
+ }
214
+ }
215
+ @else {
216
+ $SVG: $SVG + '<rect x="#{$Counter-Width}" fill="#{$Loop-Color}" width="#{$Loop-Width}" height="100%"/>';
217
+ }
247
218
  }
248
219
 
249
- // @debug $stops;
220
+ $SVG: $SVG + '</svg>';
250
221
 
222
+ @each $char, $code in $encodeMap {
223
+ $index: str-index($SVG, $char);
224
+ @while $index {
225
+ $index: str-index($SVG, $char);
226
+ $SVG: str-slice($SVG, 1, $index - 1) + $code + str-slice($SVG, $index + str-length($char));
227
+ $index: str-index($SVG, $char);
228
+ }
229
+ }
251
230
 
231
+ @if $Display {
252
232
 
253
- @include background-image(
254
- linear-gradient($direction, $stops)
255
- );
233
+ @if $bkpt != -1px {
234
+ @include breakpoint($bkpt) {
235
+ background-image: url('data:image/svg+xml,' + $SVG);
236
+ }
237
+ }
238
+ @else {
239
+ background-image: url('data:image/svg+xml,' + $SVG);
240
+ }
241
+ }
242
+ @else {
243
+ @warn 'Cannot generate a Background Grid for grid `#{$Grid}` with gutters `#{$Gutter}` and gutter style `#{$Style}`';
244
+ }
256
245
  }
257
246
  }
258
-
259
- @function build-gradient-piece($width, $color, $position: false) {
260
- @if ($position == 'last') {
261
- @return ($color $width);
262
- }
263
- @else if ($position != false) {
264
- @return $color $position, $color $width;
265
- }
266
- @else {
267
- @return $color, $color $width;
268
- }
269
- }
data/stylesheets/singularitygs/helpers/_box-sizing.scss CHANGED
@@ -1,41 +1,26 @@
1
- @import "compass/css3/shared";
2
-
3
- $box-sizing-extend: true !default;
4
- $toolkit-box-sizing: false !default;
5
-
6
1
  //////////////////////////////
7
- // Updated Box Sizing mixin, allowing for behavior support
2
+ // Box Sizing Mixin
8
3
  //////////////////////////////
9
- @mixin box-sizing($bs, $extend: $box-sizing-extend) {
10
- @if $extend and $bs == 'border-box' {
11
- @extend %border-box;
12
- }
13
- @else if $extend and $bs == 'content-box' {
14
- @extend %content-box;
4
+ $box-sizing-extend: false !default;
5
+
6
+ @mixin box-sizing($value, $extend: $box-sizing-extend) {
7
+ @if $extend {
8
+ @extend %singularity-#{$value};
15
9
  }
16
10
  @else {
17
- $bs: unquote($bs);
18
- @include experimental(box-sizing, $bs,
19
- -moz, -webkit, not -o, not -ms, not -khtml, official
20
- );
21
-
22
- @if $bs == 'border-box' {
23
- @if $legacy-support-for-ie6 or $legacy-support-for-ie7 {
24
- *behavior: stylesheet-url("../behaviors/box-sizing/boxsizing.php");
25
- }
26
- }
27
- @else {
28
- *behavior: none;
29
- }
11
+ -moz-box-sizing: $value;
12
+ box-sizing: $value;
30
13
  }
31
14
  }
32
15
 
33
- @if not $toolkit-box-sizing {
34
- %border-box {
35
- @include box-sizing('border-box', false);
36
- }
16
+ %singularity-content-box {
17
+ @include box-sizing(content-box, false);
18
+ }
37
19
 
38
- %content-box {
39
- @include box-sizing('content-box', false);
40
- }
20
+ %singularity-border-box {
21
+ @include box-sizing(border-box, false);
22
+ }
23
+
24
+ %singularity-padding-box {
25
+ @include box-sizing(padding-box, false);
41
26
  }
data/stylesheets/singularitygs/helpers/_clearfix.scss CHANGED
@@ -1,106 +1,21 @@
1
- $legacy-support-for-ie6: false !default;
2
- $legacy-support-for-ie7: false !default;
3
- $legacy-support-for-mozilla: false !default;
4
-
5
1
  //////////////////////////////
6
- // Massive Clearfix Mixin
7
- //
8
- // Clearfix mixin for all of your clearfixing needs. Will choose the right mixin for you.
9
- // Can choose whether to extend or to write.
2
+ // Clearfix Mixin
10
3
  //////////////////////////////
11
4
  $clearfix-extend: false !default;
12
- $clearfix-direct: false !default;
13
- $toolkit-clearfix: false !default;
14
-
15
- @mixin clearfix($extend: $clearfix-extend, $direct: $clearfix-direct) {
16
- @if (($legacy-support-for-ie6 or $legacy-support-for-ie7) and not $legacy-support-for-mozilla and $direct != 'legacy' and $direct != 'modern') or ($direct == 'micro') {
17
- @if $extend {
18
- @extend %clearfix-micro;
19
- }
20
- @else {
21
- /* for IE 6/7 */
22
- *zoom: expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("br")).style.cssText="clear:both;font:0/0 serif");
23
- /* non-JS fallback */
24
- *zoom: 1;
25
-
26
- &:before,
27
- &:after {
28
- content: "";
29
- display: table;
30
- }
31
-
32
- &:after {
33
- clear: both;
34
- }
35
- }
36
- }
37
- @else if (($legacy-support-for-ie6 or $legacy-support-for-ie7) and $legacy-support-for-mozilla and $direct != 'micro' and $direct != 'modern') or ($direct == 'legacy') {
38
- @if $extend {
39
- @extend %clearfix-legacy;
40
- }
41
- @else {
42
- /* for IE 6/7 */
43
- *zoom: expression(this.runtimeStyle.zoom="1", this.appendChild(document.createElement("br")).style.cssText="clear:both;font:0/0 serif");
44
- /* non-JS fallback */
45
- *zoom: 1;
46
5
 
47
- &:before,
48
- &:after {
49
- content: ".";
50
- display: block;
51
- height: 0;
52
- overflow: hidden;
53
- }
54
-
55
- &:after {
56
- clear: both;
57
- }
58
- }
6
+ @mixin clearfix($extend: $clearfix-extend) {
7
+ @if $extend {
8
+ @extend %singularity-clearfix;
59
9
  }
60
10
  @else {
61
- @if $extend {
62
- @extend %clearfix
63
- }
64
- @else {
65
- &:after {
66
- content: "";
67
- display: table;
68
- clear: both;
69
- }
11
+ &:after {
12
+ content: "";
13
+ display: table;
14
+ clear: both;
70
15
  }
71
16
  }
72
17
  }
73
18
 
74
- @if not $toolkit-clearfix {
75
- //////////////////////////////
76
- // Legacy Clearfix
77
- //
78
- // For when you need full Legacy support, including old IE and old Firefox
79
- //
80
- // From http://www.css-101.org/articles/clearfix/latest-new-clearfix-so-far.php
81
- //////////////////////////////
82
- %clearfix-legacy {
83
- @include clearfix(false, 'legacy');
84
- }
85
-
86
- //////////////////////////////
87
- // Micro Clearfix
88
- //
89
- // For when you need old IE support, but not concerned with old Firefox
90
- // From http://nicolasgallagher.com/better-float-containment-in-ie/
91
- //////////////////////////////
92
- %clearfix-micro {
93
- @include clearfix(false, 'micro');
94
- }
95
-
96
- //////////////////////////////
97
- // Modern Clearfix
98
- //
99
- // Clearfix for modern browsers, especiall when using border-box
100
- //
101
- // From http://www.css-101.org/articles/clearfix/latest-new-clearfix-so-far.php
102
- //////////////////////////////
103
- %clearfix {
104
- @include clearfix(false, 'modern');
105
- }
19
+ %singularity-clearfix {
20
+ @include clearfix(false);
106
21
  }
data/stylesheets/singularitygs/helpers/_columns.scss CHANGED
@@ -1,6 +1,4 @@
1
1
  @function end-row($span, $location, $columns) {
2
- $columns: find-grid($columns);
3
-
4
2
  @if $location == 'last' or $location == 'omega' {
5
3
  @return true;
6
4
  }
@@ -15,7 +13,10 @@
15
13
  }
16
14
 
17
15
  @function start-row($location) {
18
- @if $location == 1 {
16
+ @if $location == 'first' or $location == 'alpha' {
17
+ @return true;
18
+ }
19
+ @else if $location == 1 {
19
20
  @return true;
20
21
  }
21
22
  @else {
data/stylesheets/singularitygs/helpers/_directions.scss CHANGED
@@ -14,6 +14,12 @@
14
14
  @else if $dir == 'rtl' {
15
15
  @return ltr;
16
16
  }
17
+ @else if $dir == 'top' {
18
+ @return bottom;
19
+ }
20
+ @else if $dir == 'bottom' {
21
+ @return top;
22
+ }
17
23
  @else {
18
24
  @warn "#{$dir} is not a direction! Make sure your direction is all lowercase!";
19
25
  @return false;