sass-zero 1.1.6 → 1.2.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 (39) hide show
  1. checksums.yaml +4 -4
  2. data/.sass-zero-references.scss +15 -25
  3. data/Gemfile.lock +1 -1
  4. data/README.md +78 -42
  5. data/app/assets/stylesheets/sass-zero/{mixins.scss → _mixins.scss} +1 -4
  6. data/app/assets/stylesheets/sass-zero/base.scss +363 -1
  7. data/app/assets/stylesheets/sass-zero/variables/{breakpoints.scss → _breakpoints.scss} +5 -5
  8. data/app/assets/stylesheets/sass-zero/variables/{grid.scss → _grid.scss} +0 -20
  9. data/app/assets/stylesheets/sass-zero/variables/{typography.scss → _typography.scss} +3 -3
  10. data/lib/sass_zero/version.rb +1 -1
  11. data/sass-zero.gemspec +1 -1
  12. metadata +33 -35
  13. data/app/assets/stylesheets/sass-zero/base/preflight.scss +0 -363
  14. /data/app/assets/stylesheets/sass-zero/{variables.scss → _variables.scss} +0 -0
  15. /data/app/assets/stylesheets/sass-zero/utilities/{align.scss → _align.scss} +0 -0
  16. /data/app/assets/stylesheets/sass-zero/utilities/{animation.scss → _animation.scss} +0 -0
  17. /data/app/assets/stylesheets/sass-zero/utilities/{border.scss → _border.scss} +0 -0
  18. /data/app/assets/stylesheets/sass-zero/utilities/{container.scss → _container.scss} +0 -0
  19. /data/app/assets/stylesheets/sass-zero/utilities/{flex.scss → _flex.scss} +0 -0
  20. /data/app/assets/stylesheets/sass-zero/utilities/{flush.scss → _flush.scss} +0 -0
  21. /data/app/assets/stylesheets/sass-zero/utilities/{layout.scss → _layout.scss} +0 -0
  22. /data/app/assets/stylesheets/sass-zero/utilities/{list.scss → _list.scss} +0 -0
  23. /data/app/assets/stylesheets/sass-zero/utilities/{pad.scss → _pad.scss} +0 -0
  24. /data/app/assets/stylesheets/sass-zero/utilities/{position.scss → _position.scss} +0 -0
  25. /data/app/assets/stylesheets/sass-zero/utilities/{pull.scss → _pull.scss} +0 -0
  26. /data/app/assets/stylesheets/sass-zero/utilities/{push.scss → _push.scss} +0 -0
  27. /data/app/assets/stylesheets/sass-zero/utilities/{text.scss → _text.scss} +0 -0
  28. /data/app/assets/stylesheets/sass-zero/utilities/{unpad.scss → _unpad.scss} +0 -0
  29. /data/app/assets/stylesheets/sass-zero/variables/{border.scss → _border.scss} +0 -0
  30. /data/app/assets/stylesheets/sass-zero/variables/{colors.scss → _colors.scss} +0 -0
  31. /data/app/assets/stylesheets/sass-zero/variables/{effects.scss → _effects.scss} +0 -0
  32. /data/app/assets/stylesheets/sass-zero/variables/{filters.scss → _filters.scss} +0 -0
  33. /data/app/assets/stylesheets/sass-zero/variables/{flex.scss → _flex.scss} +0 -0
  34. /data/app/assets/stylesheets/sass-zero/variables/{height.scss → _height.scss} +0 -0
  35. /data/app/assets/stylesheets/sass-zero/variables/{sizing.scss → _sizing.scss} +0 -0
  36. /data/app/assets/stylesheets/sass-zero/variables/{transform.scss → _transform.scss} +0 -0
  37. /data/app/assets/stylesheets/sass-zero/variables/{transition.scss → _transition.scss} +0 -0
  38. /data/app/assets/stylesheets/sass-zero/variables/{width.scss → _width.scss} +0 -0
  39. /data/app/assets/stylesheets/sass-zero/variables/{zindex.scss → _zindex.scss} +0 -0
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 4fe9da1ccaf5fbc04d1681efbe93e41526f727adc32be83ebb1682f8fd4df961
4
- data.tar.gz: d7aded8f5516caa5ae57c307f755630d591d4c5f33a85308710d382a9848e376
3
+ metadata.gz: ba90537c1863378335ab5d75f4bbec2b40cadfbfe9a411ef8e9eecea7cd61b05
4
+ data.tar.gz: 60bd88b0235a72815efabf572dcd74e84d80e89e76cf62d8c11b22a9745aeee7
5
5
  SHA512:
6
- metadata.gz: a6ecefd8d3c7ac214b0afe5ef25171a703e704fe8480c3be010ec681cde5003d43c7fe4e7e849ee5650b389307dbb381e7d8e2225f2cbf89f4865aa8c66063a6
7
- data.tar.gz: a79e1322722d6bfe2fe3b91b16e24c500f4a00297e42607011f2257250b0e07c55b04abc2851ce443d2b2a6f95862e48300e180ae386553ed222ba6f26ad0b6a
6
+ metadata.gz: aa3f62f922ef34285d8e76a20dd36ee5b5efedcda713bed5fce70781fc3e7007adc1ba32bdd487285ea09ae602c6691edb1d1338f01dfcb82b8cd66f597e6611
7
+ data.tar.gz: 9f72e0f2ef60bccdf82009276a423ede2c88be2ba3a9e238a05060bd82e47c8e168a382977230644f7616c125ddd6145913cc967b9f738407034db0f1bcabdb9
@@ -1,5 +1,5 @@
1
1
  // *******************************************************************
2
- // borders.scss
2
+ // Borders
3
3
  // *******************************************************************
4
4
 
5
5
  $rounded-none: 0;
@@ -19,7 +19,7 @@ $border-4: 4px;
19
19
  $border-8: 8px;
20
20
 
21
21
  // *******************************************************************
22
- // breakpoints.scss
22
+ // Breakpoints
23
23
  // *******************************************************************
24
24
 
25
25
  $breakpoint-sm: 640px;
@@ -29,7 +29,7 @@ $breakpoint-xl: 1280px;
29
29
  $breakpoint-2xl: 1536px;
30
30
 
31
31
  // *******************************************************************
32
- // colors.scss
32
+ // Colors
33
33
  // *******************************************************************
34
34
 
35
35
  $transparent: transparent;
@@ -281,7 +281,7 @@ $blue-gray-800: #1e293b;
281
281
  $blue-gray-900: #0f172a;
282
282
 
283
283
  // *******************************************************************
284
- // effects.scss
284
+ // Effects
285
285
  // *******************************************************************
286
286
 
287
287
  $shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
@@ -310,7 +310,7 @@ $opacity-95: 0.95;
310
310
  $opacity-100: 1;
311
311
 
312
312
  // *******************************************************************
313
- // filters.scss
313
+ // Filters
314
314
  // *******************************************************************
315
315
 
316
316
  $blur-none: blur(0);
@@ -373,7 +373,7 @@ $sepia-0: sepia(0);
373
373
  $sepia: sepia(100%);
374
374
 
375
375
  // *******************************************************************
376
- // flex.scss
376
+ // Flex
377
377
  // *******************************************************************
378
378
 
379
379
  $flex-1: 1 1 0%; // Allow grow and shrink, ignoring its initial size.
@@ -388,7 +388,7 @@ $flex-shrink-0: 0;
388
388
  $flex-shrink: 1;
389
389
 
390
390
  // *******************************************************************
391
- // grid.scss
391
+ // Grid
392
392
  // *******************************************************************
393
393
 
394
394
  $grid-cols-1: repeat(1, minmax(0, 1fr));
@@ -437,18 +437,8 @@ $row-span-5: span 5 / span 5;
437
437
  $row-span-6: span 6 / span 6;
438
438
  $row-span-full: calc(1 / -1);
439
439
 
440
- $auto-cols-auto: auto;
441
- $auto-cols-min: min-content;
442
- $auto-cols-max: max-content;
443
- $auto-cols-fr: minmax(0, 1fr);
444
-
445
- $auto-rows-auto: auto;
446
- $auto-rows-min: min-content;
447
- $auto-rows-max: max-content;
448
- $auto-rows-fr: minmax(0, 1fr);
449
-
450
440
  // *******************************************************************
451
- // height.scss
441
+ // Height
452
442
  // *******************************************************************
453
443
 
454
444
  $h-auto: auto;
@@ -487,7 +477,7 @@ $max-h-max: max-content;
487
477
  $max-h-fit: fit-content;
488
478
 
489
479
  // *******************************************************************
490
- // sizing.scss
480
+ // Sizing
491
481
  // *******************************************************************
492
482
 
493
483
  $size-px: 1px;
@@ -523,7 +513,7 @@ $size-80: 20rem;
523
513
  $size-96: 24rem;
524
514
 
525
515
  // *******************************************************************
526
- // transform.scss
516
+ // Transform
527
517
  // *******************************************************************
528
518
 
529
519
  $scale-0: 0;
@@ -563,7 +553,7 @@ $skew-6: 6deg;
563
553
  $skew-12: 12deg;
564
554
 
565
555
  // *******************************************************************
566
- // transition.scss
556
+ // Transition
567
557
  // *******************************************************************
568
558
 
569
559
  $transition-none: none;
@@ -598,7 +588,7 @@ $ease-out: cubic-bezier(0, 0, 0.2, 1);
598
588
  $ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
599
589
 
600
590
  // *******************************************************************
601
- // typography.scss
591
+ // Typography
602
592
  // *******************************************************************
603
593
 
604
594
  $font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
@@ -652,7 +642,7 @@ $tracking-wider: 0.05em;
652
642
  $tracking-widest: 0.1em;
653
643
 
654
644
  // *******************************************************************
655
- // width.scss
645
+ // Width
656
646
  // *******************************************************************
657
647
 
658
648
  $w-auto: auto;
@@ -713,7 +703,7 @@ $max-w-max: max-content;
713
703
  $max-w-fit: fit-content;
714
704
 
715
705
  // *******************************************************************
716
- // zindex.scss
706
+ // Zindex
717
707
  // *******************************************************************
718
708
 
719
709
  $z-auto: auto;
@@ -725,7 +715,7 @@ $z-40: 40;
725
715
  $z-50: 50;
726
716
 
727
717
  // *******************************************************************
728
- // mixins.scss
718
+ // Mixins
729
719
  // *******************************************************************
730
720
 
731
721
  @mixin antialiased {}
data/Gemfile.lock CHANGED
@@ -1,7 +1,7 @@
1
1
  PATH
2
2
  remote: .
3
3
  specs:
4
- sass-zero (1.1.6)
4
+ sass-zero (1.2.0)
5
5
 
6
6
  GEM
7
7
  remote: https://rubygems.org/
data/README.md CHANGED
@@ -21,77 +21,89 @@ Add these lines to your application.css:
21
21
 
22
22
  ### Variables
23
23
 
24
+ Instead of hand-picking values from a limitless pool any time you need to make a decision, start with a smaller set of options.
25
+
24
26
  #### Essential
25
27
 
26
- - [Border](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/border.scss)
27
- - [Colors](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/colors.scss)
28
- - [Effects](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/effects.scss)
29
- - [Flex](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/flex.scss)
30
- - [Grid](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/grid.scss)
31
- - [Height](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/height.scss)
32
- - [Sizing](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/sizing.scss)
33
- - [Typography](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/typography.scss)
34
- - [Width](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/width.scss)
28
+ - [Border](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_border.scss)
29
+ - [Colors](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_colors.scss)
30
+ - [Effects](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_effects.scss)
31
+ - [Height](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_height.scss)
32
+ - [Sizing](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_sizing.scss)
33
+ - [Typography](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_typography.scss)
34
+ - [Width](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_width.scss)
35
+ - [Z-Index](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_zindex.scss)
35
36
 
36
37
  #### Others
37
38
 
38
- - [Breakpoints](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/breakpoints.scss)
39
- - [Filters](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/filters.scss)
40
- - [Transform](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/transform.scss)
41
- - [Transition](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/transition.scss)
42
- - [Z-Index](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/zindex.scss)
39
+ - [Breakpoints](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_breakpoints.scss)
40
+ - [Filters](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_filters.scss)
41
+ - [Flex](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_flex.scss)
42
+ - [Grid](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_grid.scss)
43
+ - [Transform](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_transform.scss)
44
+ - [Transition](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/variables/_transition.scss)
45
+ - [Mixins](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/_mixins.scss)
43
46
 
44
47
  ### Utility classes
45
48
 
46
- - [Align](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/align.scss)
47
- - [Animation](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/animation.scss)
48
- - [Border](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/border.scss)
49
- - [Container](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/container.scss)
50
- - [Flex Utilities](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/flex.scss)
51
- - [Layout Utilities](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/layout.scss)
52
- - [List Utilities](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/list.scss)
53
- - [Margin Pull](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/pull.scss)
54
- - [Margin Push](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/push.scss)
55
- - [Margin Reset](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/flush.scss)
56
- - [Padding](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/pad.scss)
57
- - [Padding Reset](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/unpad.scss)
58
- - [Position Utilities](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/position.scss)
59
- - [Text Utilities](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/text.scss)
60
-
61
- ### Breadboard
62
-
63
- - [Breadboard](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/breadboard.scss)
64
- - [Example](https://github.com/lazaronixon/sass-zero/blob/master/example.html)
49
+ This can be useful for dealing with similar components, and positioning.
50
+
51
+ - [Align](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_align.scss)
52
+ - [Animation](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_animation.scss)
53
+ - [Border](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_border.scss)
54
+ - [Container](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_container.scss)
55
+ - [Flex Utilities](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_flex.scss)
56
+ - [Layout Utilities](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_layout.scss)
57
+ - [List Utilities](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_list.scss)
58
+ - [Margin Pull](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_pull.scss)
59
+ - [Margin Push](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_push.scss)
60
+ - [Margin Reset](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_flush.scss)
61
+ - [Padding](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_pad.scss)
62
+ - [Padding Reset](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_unpad.scss)
63
+ - [Position Utilities](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_position.scss)
64
+ - [Text Utilities](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/utilities/_text.scss)
65
65
 
66
66
  ## Breadboard
67
67
 
68
- This is an optional black-and-white theme that you can use as design foundation.
68
+ This is an optional grayscale theme that you can use as design foundation.
69
69
 
70
- ![screenshot](https://nixo-etc.s3-sa-east-1.amazonaws.com/sass-zero-screenshot-3.png)
70
+ - [Breadboard](https://github.com/lazaronixon/sass-zero/blob/master/app/assets/stylesheets/sass-zero/breadboard.scss)
71
+ - [Screenshot](https://nixo-etc.s3-sa-east-1.amazonaws.com/sass-zero-screenshot-3.png)
72
+ - [Example](https://github.com/lazaronixon/sass-zero/blob/master/example.html)
71
73
 
72
74
  ## Using variables
73
75
 
74
- Create some stylesheet using [BEM](http://getbem.com/naming) and [SASS-ZERO Variables](https://github.com/lazaronixon/sass-zero/blob/master/vendor/assets/stylesheets/sass-zero/variables.scss):
76
+ Create some stylesheet using [BEM](http://getbem.com/naming) and [SASS-ZERO Variables](https://github.com/lazaronixon/sass-zero/blob/master/vendor/assets/stylesheets/sass-zero/_variables.scss):
75
77
 
76
78
  ```scss
77
79
  @import "sass-zero/variables";
78
80
 
79
81
  .block {
80
- color: $red-300;
82
+ color: $rose-500;
83
+
84
+ &__element_one {
85
+ color: $fuchsia-500;
86
+ }
81
87
 
82
- &__element {
83
- color: $red-400;
88
+ &__element_two {
89
+ color: $purple-500;
84
90
  }
85
91
 
86
92
  &--modifier {
87
- color: $red-500;
93
+ color: $violet-500;
88
94
  }
89
95
  }
90
96
  ```
91
97
 
92
98
  ```html
99
+ <div class="block">
100
+ <div class="block__element_one" />
101
+ <div class="block__element_two" />
102
+ </div>
103
+
93
104
  <div class="block block--modifier">
94
- <div class="block__element" />
105
+ <div class="block__element_one" />
106
+ <div class="block__element_two" />
95
107
  </div>
96
108
  ```
97
109
 
@@ -102,10 +114,34 @@ Create some stylesheet using [BEM](http://getbem.com/naming) and [SASS-ZERO Vari
102
114
  1. Copy `.sass-zero-references.scss` to the root of your application.
103
115
  2. Install [SCSS IntelliSense](https://marketplace.visualstudio.com/items?itemName=mrmlnc.vscode-scss).
104
116
 
105
- ### Atom/TextMate
117
+ ### Pulsar/TextMate
106
118
 
107
119
  1. Copy `.sass-zero-references.scss` to the root of your application.
108
120
 
121
+ ## Customization
122
+
123
+ ### Breadboard
124
+
125
+ When you are sure about the style of your application you should make a copy of `breadboard.scss` and customize fonts, borders, and colors.
126
+
127
+ You will need to remove the original breadboard from application.css:
128
+
129
+ ```css
130
+ *= require sass-zero/base
131
+ *= require sass-zero/utilities
132
+ ```
133
+
134
+ ### Variables
135
+
136
+ Instead of using the default variables you can add more or change the existents, I recommend you make a copy of `_variables.scss` to your application and change it as you want.
137
+
138
+ ```scss
139
+ @import "sass-zero/variables/border";
140
+ @import "sass-zero/variables/breakpoints";
141
+ @import "design-system/colors";
142
+ ...
143
+ ```
144
+
109
145
  ## Development
110
146
 
111
147
  To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release`, which will create a git tag for the version, push git commits and the created tag, and push the `.gem` file to [rubygems.org](https://rubygems.org).
@@ -1,7 +1,4 @@
1
- @import "variables/border";
2
- @import "variables/effects";
3
1
  @import "variables/sizing";
4
- @import "variables/zindex";
5
2
 
6
3
  @mixin antialiased {
7
4
  -webkit-font-smoothing: antialiased;
@@ -39,7 +36,7 @@
39
36
  padding-right: $padding-x;
40
37
  padding-left: $padding-x;
41
38
  margin-right: auto;
42
- margin-left: auto;
39
+ margin-left: auto;
43
40
  }
44
41
 
45
42
  @mixin gradient($direction, $from, $to: transparent, $via: null) {