sass-zero 0.0.41 → 0.0.42

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 (27) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +3 -0
  3. data/app/assets/stylesheets/sass-zero/base.scss +0 -1
  4. data/app/assets/stylesheets/sass-zero/base/preflight.scss +14 -4
  5. data/app/assets/stylesheets/sass-zero/{base/breadboard.scss → breadboard.scss} +25 -9
  6. data/app/assets/stylesheets/sass-zero/mixins.scss +27 -18
  7. data/app/assets/stylesheets/sass-zero/utilities.scss +1 -0
  8. data/app/assets/stylesheets/sass-zero/utilities/animation.scss +59 -0
  9. data/app/assets/stylesheets/sass-zero/utilities/flex.scss +33 -21
  10. data/app/assets/stylesheets/sass-zero/utilities/list.scss +1 -1
  11. data/app/assets/stylesheets/sass-zero/utilities/text.scss +38 -3
  12. data/app/assets/stylesheets/sass-zero/variables.scss +1 -0
  13. data/app/assets/stylesheets/sass-zero/variables/border.scss +4 -1
  14. data/app/assets/stylesheets/sass-zero/variables/breakpoints.scss +5 -4
  15. data/app/assets/stylesheets/sass-zero/variables/colors.scss +239 -118
  16. data/app/assets/stylesheets/sass-zero/variables/effects.scss +30 -4
  17. data/app/assets/stylesheets/sass-zero/variables/flex.scss +17 -1
  18. data/app/assets/stylesheets/sass-zero/variables/grid.scss +85 -0
  19. data/app/assets/stylesheets/sass-zero/variables/spacing.scss +16 -2
  20. data/app/assets/stylesheets/sass-zero/variables/transform.scss +9 -2
  21. data/app/assets/stylesheets/sass-zero/variables/typography.scss +18 -15
  22. data/app/assets/stylesheets/sass-zero/variables/width.scss +8 -3
  23. data/app/assets/stylesheets/sass-zero/variables/zindex.scss +1 -1
  24. data/lib/sass/zero/version.rb +1 -1
  25. data/package.json +1 -1
  26. metadata +10 -9
  27. data/app/assets/stylesheets/sass-zero/base/variables.scss +0 -7
@@ -1,9 +1,25 @@
1
1
  // *******************************************************************
2
2
  // Flex
3
3
  // Variables for controlling how flex items both grow and shrink.
4
- // flex: $$flex-1;
4
+ // flex: $flex-1;
5
5
  // *******************************************************************
6
6
  $flex-1: 1 1 0%;
7
7
  $flex-auto: 1 1 auto;
8
8
  $flex-initial: 0 1 auto;
9
9
  $flex-none: none;
10
+
11
+ // *******************************************************************
12
+ // Flex Grow
13
+ // Utilities for controlling how flex items grow.
14
+ // flex-grow: $flex-grow-0;
15
+ // *******************************************************************
16
+ $flex-grow-0: 0;
17
+ $flex-grow: 1;
18
+
19
+ // *******************************************************************
20
+ // Flex Shrink
21
+ // Utilities for controlling how flex items shrink.
22
+ // flex-shrink: $flex-shrink-0;
23
+ // *******************************************************************
24
+ $flex-shrink-0: 0;
25
+ $flex-shrink: 1;
@@ -0,0 +1,85 @@
1
+ // *******************************************************************
2
+ // Grid Template Columns
3
+ // Utilities for specifying the columns in a grid layout.
4
+ // grid-template-columns: $grid-cols-1;
5
+ // *******************************************************************
6
+ $grid-cols-1: repeat(1, minmax(0, 1fr));
7
+ $grid-cols-2: repeat(2, minmax(0, 1fr));
8
+ $grid-cols-3: repeat(3, minmax(0, 1fr));
9
+ $grid-cols-4: repeat(4, minmax(0, 1fr));
10
+ $grid-cols-5: repeat(5, minmax(0, 1fr));
11
+ $grid-cols-6: repeat(6, minmax(0, 1fr));
12
+ $grid-cols-7: repeat(7, minmax(0, 1fr));
13
+ $grid-cols-8: repeat(8, minmax(0, 1fr));
14
+ $grid-cols-9: repeat(9, minmax(0, 1fr));
15
+ $grid-cols-10: repeat(10, minmax(0, 1fr));
16
+ $grid-cols-11: repeat(11, minmax(0, 1fr));
17
+ $grid-cols-12: repeat(12, minmax(0, 1fr));
18
+ $grid-cols-none: none;
19
+
20
+ // *******************************************************************
21
+ // Grid Column Start / End
22
+ // Utilities for controlling how elements are sized and placed across grid columns.
23
+ // grid-column: $col-span-1;
24
+ // *******************************************************************
25
+ $col-auto: auto;
26
+ $col-span-1: span 1 / span 1;
27
+ $col-span-2: span 2 / span 2;
28
+ $col-span-3: span 3 / span 3;
29
+ $col-span-4: span 4 / span 4;
30
+ $col-span-5: span 5 / span 5;
31
+ $col-span-6: span 6 / span 6;
32
+ $col-span-7: span 7 / span 7;
33
+ $col-span-8: span 8 / span 8;
34
+ $col-span-9: span 9 / span 9;
35
+ $col-span-10: span 10 / span 10;
36
+ $col-span-11: span 11 / span 11;
37
+ $col-span-12: span 12 / span 12;
38
+ $col-span-full: 1 / -1;
39
+
40
+ // *******************************************************************
41
+ // Grid Template Rows
42
+ // Utilities for specifying the rows in a grid layout.
43
+ // grid-template-rows: $grid-rows-1;
44
+ // *******************************************************************
45
+ $grid-rows-1: repeat(1, minmax(0, 1fr));
46
+ $grid-rows-2: repeat(2, minmax(0, 1fr));
47
+ $grid-rows-3: repeat(3, minmax(0, 1fr));
48
+ $grid-rows-4: repeat(4, minmax(0, 1fr));
49
+ $grid-rows-5: repeat(5, minmax(0, 1fr));
50
+ $grid-rows-6: repeat(6, minmax(0, 1fr));
51
+ $grid-rows-none: none;
52
+
53
+ // *******************************************************************
54
+ // Grid Row Start / End
55
+ // Utilities for controlling how elements are sized and placed across grid rows.
56
+ // grid-row: $row-span-1;
57
+ // *******************************************************************
58
+ $row-auto: auto;
59
+ $row-span-1: span 1 / span 1;
60
+ $row-span-2: span 2 / span 2;
61
+ $row-span-3: span 3 / span 3;
62
+ $row-span-4: span 4 / span 4;
63
+ $row-span-5: span 5 / span 5;
64
+ $row-span-6: span 6 / span 6;
65
+ $row-span-full: 1 / -1;
66
+
67
+ // *******************************************************************
68
+ // Grid Auto Columns
69
+ // Utilities for controlling the size of implicitly-created grid columns.
70
+ // grid-auto-columns: $auto-cols-auto;
71
+ // *******************************************************************
72
+ $auto-cols-auto: auto;
73
+ $auto-cols-min: min-content;
74
+ $auto-cols-max: max-content;
75
+ $auto-cols-fr: minmax(0, 1fr);
76
+
77
+ // *******************************************************************
78
+ // Grid Auto Rows
79
+ // Utilities for controlling the size of implicitly-created grid rows.
80
+ // grid-auto-rows: $auto-rows-auto;
81
+ // *******************************************************************
82
+ $auto-rows-auto: auto;
83
+ $auto-rows-min: min-content;
84
+ $auto-rows-max: max-content;
85
+ $auto-rows-fr: minmax(0, 1fr);
@@ -3,28 +3,42 @@
3
3
  // By default, Tailwind includes a generous and comprehensive numeric spacing scale.
4
4
  // Use as padding, margin, width, height, transform
5
5
  // *******************************************************************
6
- $size-0: 0;
6
+ $size-px: 1px;
7
+ $size-0: 0px;
7
8
  $size-1: 0.25rem;
8
9
  $size-2: 0.5rem;
9
10
  $size-3: 0.75rem;
10
11
  $size-4: 1rem;
11
12
  $size-5: 1.25rem;
12
13
  $size-6: 1.5rem;
14
+ $size-7: 1.75rem;
13
15
  $size-8: 2rem;
16
+ $size-9: 2.25rem;
14
17
  $size-10: 2.5rem;
18
+ $size-11: 2.75rem;
15
19
  $size-12: 3rem;
20
+ $size-14: 3.5rem;
16
21
  $size-16: 4rem;
17
22
  $size-20: 5rem;
18
23
  $size-24: 6rem;
24
+ $size-28: 7rem;
19
25
  $size-32: 8rem;
26
+ $size-36: 9rem;
20
27
  $size-40: 10rem;
28
+ $size-44: 11rem;
21
29
  $size-48: 12rem;
30
+ $size-52: 13rem;
22
31
  $size-56: 14rem;
32
+ $size-60: 15rem;
23
33
  $size-64: 16rem;
24
- $size-px: 1px;
34
+ $size-72: 18rem;
35
+ $size-80: 20rem;
36
+ $size-96: 24rem;
25
37
 
26
38
  $size-auto: auto;
27
39
  $size-full: 100%;
28
40
  $size-screen: 100vw;
41
+ $size-min: min-content;
42
+ $size-max: max-content;
29
43
 
30
44
  $size-map: ("xs": $size-1, "sm": $size-2, "md": $size-4, "lg": $size-6, "xl": $size-8, "2xl": $size-10, "3xl": $size-12);
@@ -19,7 +19,12 @@ $scale-150: 1.50;
19
19
  // Variables for rotating elements with transform.
20
20
  // transform: rotate($rotate-45);
21
21
  // *******************************************************************
22
- $rotate-0: 0;
22
+ $rotate-0: 0deg;
23
+ $rotate-1: 1deg;
24
+ $rotate-2: 2deg;
25
+ $rotate-3: 3deg;
26
+ $rotate-6: 6deg;
27
+ $rotate-12: 12deg;
23
28
  $rotate-45: 45deg;
24
29
  $rotate-90: 90deg;
25
30
  $rotate-180: 180deg;
@@ -29,7 +34,9 @@ $rotate-180: 180deg;
29
34
  // Variables for skewing elements with transform.
30
35
  // transform: skew($skew-3);
31
36
  // *******************************************************************
32
- $skew-0: 0;
37
+ $skew-0: 0deg;
38
+ $skew-1: 1deg;
39
+ $skew-2: 2deg;
33
40
  $skew-3: 3deg;
34
41
  $skew-6: 6deg;
35
42
  $skew-12: 12deg;
@@ -3,9 +3,9 @@
3
3
  // Variables for controlling the font family of an element.
4
4
  // font-family: $font-sans;
5
5
  // *******************************************************************
6
- $font-sans: 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";
7
- $font-serif: Georgia, Cambria, "Times New Roman", Times, serif;
8
- $font-mono: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
6
+ $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";
7
+ $font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
8
+ $font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
9
9
 
10
10
  // *******************************************************************
11
11
  // Font Size
@@ -21,22 +21,25 @@ $text-2xl: 1.5rem;
21
21
  $text-3xl: 1.875rem;
22
22
  $text-4xl: 2.25rem;
23
23
  $text-5xl: 3rem;
24
- $text-6xl: 4rem;
24
+ $text-6xl: 3.75rem;
25
+ $text-7xl: 4.5rem;
26
+ $text-8xl: 6rem;
27
+ $text-9xl: 8rem;
25
28
 
26
29
  // *******************************************************************
27
30
  // Font Weight
28
31
  // Variables for controlling the font weight of an element.
29
32
  // font-weight: $font-hairline;
30
33
  // *******************************************************************
31
- $font-hairline: 100;
32
- $font-thin: 200;
33
- $font-light: 300;
34
- $font-normal: 400;
35
- $font-medium: 500;
36
- $font-semibold: 600;
37
- $font-bold: 700;
38
- $font-extrabold: 800;
39
- $font-black: 900;
34
+ $font-thin: 100;
35
+ $font-extralight: 200;
36
+ $font-light: 300;
37
+ $font-normal: 400;
38
+ $font-medium: 500;
39
+ $font-semibold: 600;
40
+ $font-bold: 700;
41
+ $font-extrabold: 800;
42
+ $font-black: 900;
40
43
 
41
44
  // *******************************************************************
42
45
  // Line Height
@@ -48,7 +51,7 @@ $leading-tight: 1.25;
48
51
  $leading-snug: 1.375;
49
52
  $leading-normal: 1.5;
50
53
  $leading-relaxed: 1.625;
51
- $leading-loose: 1.2;
54
+ $leading-loose: 2;
52
55
  $leading-3: .75rem;
53
56
  $leading-4: 1rem;
54
57
  $leading-5: 1.25rem;
@@ -65,7 +68,7 @@ $leading-10: 2.5rem;
65
68
  // *******************************************************************
66
69
  $tracking-tighter: -0.05em;
67
70
  $tracking-tight: -0.025em;
68
- $tracking-normal: 0;
71
+ $tracking-normal: 0em;
69
72
  $tracking-wide: 0.025em;
70
73
  $tracking-wider: 0.05em;
71
74
  $tracking-widest: 0.1em;
@@ -35,14 +35,18 @@ $w-11-12: 91.666667%;
35
35
  // Variables for setting the minimum width of an element
36
36
  // min-width: $min-w-0;
37
37
  // *******************************************************************
38
- $min-w-0: 0;
38
+ $min-w-0: 0px;
39
39
  $min-w-full: 100%;
40
+ $min-w-min: min-content;
41
+ $min-w-max: max-content;
40
42
 
41
43
  // *******************************************************************
42
44
  // Max-Width
43
45
  // Variables for setting the maximum width of an element
44
46
  // max-width: $max-w-xs;
45
47
  // *******************************************************************
48
+ $max-w-none: none;
49
+ $max-w-0: 0rem;
46
50
  $max-w-xs: 20rem;
47
51
  $max-w-sm: 24rem;
48
52
  $max-w-md: 28rem;
@@ -55,14 +59,15 @@ $max-w-5xl: 64rem;
55
59
  $max-w-6xl: 72rem;
56
60
  $max-w-7xl: 80rem;
57
61
  $max-w-full: 100%;
58
- $max-w-none: none;
62
+ $max-w-min: min-content;
63
+ $max-w-max: max-content;
59
64
 
60
65
  // *******************************************************************
61
66
  // Min-Height
62
67
  // Variables for setting the minimum height of an element
63
68
  // min-height: $min-h-0;
64
69
  // *******************************************************************
65
- $min-h-0: 0;
70
+ $min-h-0: 0px;
66
71
  $min-h-full: 100%;
67
72
  $min-h-screen: 100vh;
68
73
 
@@ -3,10 +3,10 @@
3
3
  // Variables for controlling the stack order of an element.
4
4
  // z-index: $z-0;
5
5
  // *******************************************************************
6
+ $z-auto: auto;
6
7
  $z-0: 0;
7
8
  $z-10: 10;
8
9
  $z-20: 20;
9
10
  $z-30: 30;
10
11
  $z-40: 40;
11
12
  $z-50: 50;
12
- $z-auto: auto;
@@ -1,5 +1,5 @@
1
1
  module Sass
2
2
  module Zero
3
- VERSION = "0.0.41"
3
+ VERSION = "0.0.42"
4
4
  end
5
5
  end
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sass-zero",
3
- "version": "0.0.41",
3
+ "version": "0.0.42",
4
4
  "description": "A CSS framework for rapid UI development based on tailwindcss, miligram and BEM.",
5
5
  "homepage": "https://github.com/lazaronixon/sass-zero",
6
6
  "repository": "lazaronixon/sass-zero",
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: sass-zero
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.41
4
+ version: 0.0.42
5
5
  platform: ruby
6
6
  authors:
7
7
  - lazaronixon
8
- autorequire:
8
+ autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2020-05-19 00:00:00.000000000 Z
11
+ date: 2020-12-13 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: autoprefixer-rails
@@ -24,7 +24,7 @@ dependencies:
24
24
  - - ">="
25
25
  - !ruby/object:Gem::Version
26
26
  version: 9.7.4
27
- description:
27
+ description:
28
28
  email:
29
29
  - lazaronixon@hotmail.com
30
30
  executables: []
@@ -37,12 +37,12 @@ files:
37
37
  - Gemfile
38
38
  - README.md
39
39
  - app/assets/stylesheets/sass-zero/base.scss
40
- - app/assets/stylesheets/sass-zero/base/breadboard.scss
41
40
  - app/assets/stylesheets/sass-zero/base/normalize.css
42
41
  - app/assets/stylesheets/sass-zero/base/preflight.scss
43
- - app/assets/stylesheets/sass-zero/base/variables.scss
42
+ - app/assets/stylesheets/sass-zero/breadboard.scss
44
43
  - app/assets/stylesheets/sass-zero/mixins.scss
45
44
  - app/assets/stylesheets/sass-zero/utilities.scss
45
+ - app/assets/stylesheets/sass-zero/utilities/animation.scss
46
46
  - app/assets/stylesheets/sass-zero/utilities/flex.scss
47
47
  - app/assets/stylesheets/sass-zero/utilities/flush.scss
48
48
  - app/assets/stylesheets/sass-zero/utilities/layout.scss
@@ -58,6 +58,7 @@ files:
58
58
  - app/assets/stylesheets/sass-zero/variables/colors.scss
59
59
  - app/assets/stylesheets/sass-zero/variables/effects.scss
60
60
  - app/assets/stylesheets/sass-zero/variables/flex.scss
61
+ - app/assets/stylesheets/sass-zero/variables/grid.scss
61
62
  - app/assets/stylesheets/sass-zero/variables/spacing.scss
62
63
  - app/assets/stylesheets/sass-zero/variables/transform.scss
63
64
  - app/assets/stylesheets/sass-zero/variables/transition.scss
@@ -72,7 +73,7 @@ homepage: http://github.com/lazaronixon/sass-zero
72
73
  licenses:
73
74
  - MIT
74
75
  metadata: {}
75
- post_install_message:
76
+ post_install_message:
76
77
  rdoc_options: []
77
78
  require_paths:
78
79
  - lib
@@ -87,8 +88,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
87
88
  - !ruby/object:Gem::Version
88
89
  version: '0'
89
90
  requirements: []
90
- rubygems_version: 3.0.6
91
- signing_key:
91
+ rubygems_version: 3.1.4
92
+ signing_key:
92
93
  specification_version: 4
93
94
  summary: A CSS framework for rapid UI development based on tailwindcss, miligram and
94
95
  BEM.
@@ -1,7 +0,0 @@
1
- @import "sass-zero/variables";
2
-
3
- $breadboard-primary: $gray-900;
4
- $breadboard-color: $gray-800;
5
- $breadboard-placeholder: $gray-500;
6
- $breadboard-border: $gray-300;
7
- $breadboard-background: $gray-200;