@graupl/core 1.0.0-beta.51 → 1.0.0-beta.53

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. package/dist/css/graupl.css +1 -1
  2. package/dist/css/graupl.css.map +1 -1
  3. package/dist/css/layout/columns.css +1 -1
  4. package/dist/css/layout/columns.css.map +1 -1
  5. package/dist/css/layout/flex-columns.css.map +1 -1
  6. package/dist/css/layout.css +1 -1
  7. package/dist/css/layout.css.map +1 -1
  8. package/dist/css/utilities/block-size.css +1 -1
  9. package/dist/css/utilities/block-size.css.map +1 -1
  10. package/dist/css/utilities/grid.css +2 -0
  11. package/dist/css/utilities/grid.css.map +1 -0
  12. package/dist/css/utilities/inline-size.css +1 -1
  13. package/dist/css/utilities/inline-size.css.map +1 -1
  14. package/dist/css/utilities.css +1 -1
  15. package/dist/css/utilities.css.map +1 -1
  16. package/package.json +1 -1
  17. package/scss/utilities/grid.scss +3 -0
  18. package/src/scss/_defaults.scss +4 -0
  19. package/src/scss/layout/columns/_defaults.scss +26 -4
  20. package/src/scss/layout/columns/_index.scss +346 -35
  21. package/src/scss/layout/flex-columns/_defaults.scss +2 -2
  22. package/src/scss/layout/flex-columns/_index.scss +41 -41
  23. package/src/scss/utilities/_index.scss +1 -0
  24. package/src/scss/utilities/_template/_index.scss +1 -1
  25. package/src/scss/utilities/block-size/_defaults.scss +3 -3
  26. package/src/scss/utilities/block-size/_index.scss +84 -84
  27. package/src/scss/utilities/grid/_defaults.scss +89 -0
  28. package/src/scss/utilities/grid/_index.scss +236 -0
  29. package/src/scss/utilities/grid/_variables.scss +6 -0
  30. package/src/scss/utilities/grid/col-span/_defaults.scss +102 -0
  31. package/src/scss/utilities/grid/col-span/_index.scss +124 -0
  32. package/src/scss/utilities/grid/col-span/_variables.scss +6 -0
  33. package/src/scss/utilities/grid/grid-column/_defaults.scss +104 -0
  34. package/src/scss/utilities/grid/grid-column/_index.scss +140 -0
  35. package/src/scss/utilities/grid/grid-column/_variables.scss +6 -0
  36. package/src/scss/utilities/grid/grid-row/_defaults.scss +104 -0
  37. package/src/scss/utilities/grid/grid-row/_index.scss +140 -0
  38. package/src/scss/utilities/grid/grid-row/_variables.scss +6 -0
  39. package/src/scss/utilities/grid/grid-template-columns/_defaults.scss +102 -0
  40. package/src/scss/utilities/grid/grid-template-columns/_index.scss +124 -0
  41. package/src/scss/utilities/grid/grid-template-columns/_variables.scss +6 -0
  42. package/src/scss/utilities/grid/grid-template-rows/_defaults.scss +102 -0
  43. package/src/scss/utilities/grid/grid-template-rows/_index.scss +124 -0
  44. package/src/scss/utilities/grid/grid-template-rows/_variables.scss +6 -0
  45. package/src/scss/utilities/grid/row-span/_defaults.scss +102 -0
  46. package/src/scss/utilities/grid/row-span/_index.scss +124 -0
  47. package/src/scss/utilities/grid/row-span/_variables.scss +6 -0
  48. package/src/scss/utilities/inline-size/_defaults.scss +3 -3
  49. package/src/scss/utilities/inline-size/_index.scss +84 -84
package/src/scss/utilities/inline-size/_index.scss CHANGED
@@ -3,90 +3,90 @@
3
3
  // This file generates the inline-size utility classes provided by Graupl.
4
4
  //
5
5
  // The following classes are generated by default:
6
- // - `.inline-auto`: Sets the `inline-size` property to `auto`.
7
- // - `.inline-fit-content`: Sets the `inline-size` property to `fit-content`.
8
- // - `.inline-max-content`: Sets the `inline-size` property to `max-content`.
9
- // - `.inline-min-content`: Sets the `inline-size` property to `min-content`.
10
- // - `.inline-stretch`: Sets the `inline-size` property to `stretch`.
11
- // - `.inline-full`: Sets the `inline-size` property to `100%`.
12
- // - `.inline-quarter`: Sets the `inline-size` property to `25%`.
13
- // - `.inline-half`: Sets the `inline-size` property to `50%`.
14
- // - `.inline-three-quarters`: Sets the `inline-size` property to `75%`.
15
- // - `.inline-third`: Sets the `inline-size` property to `calc(100% / 3)`.
16
- // - `.inline-two-thirds`: Sets the `inline-size` property to `calc(100% / 1.5)`.
17
- // - `.inline-half-screen`: Sets the `inline-size` property to `50vw`.
18
- // - `.inline-third-screen`: Sets the `inline-size` property to `calc(100vw / 3)`.
19
- // - `.inline-two-thirds-screen`: Sets the `inline-size` property to `calc(100vw / 1.5)`.
20
- // - `.inline-quarter-screen`: Sets the `inline-size` property to `25vw`.
21
- // - `.inline-three-quarters-screen`: Sets the `inline-size` property to `75vw`.
22
- // - `.inline-full-screen`: Sets the `inline-size` property to `100vw`.
23
- // - `.inline-0`: Sets the `inline-size` property to `var(--graupl-spacer-0)`.
24
- // - `.inline-1`: Sets the `inline-size` property to `var(--graupl-spacer-1)`.
25
- // - `.inline-2`: Sets the `inline-size` property to `var(--graupl-spacer-2)`.
26
- // - `.inline-3`: Sets the `inline-size` property to `var(--graupl-spacer-3)`.
27
- // - `.inline-4`: Sets the `inline-size` property to `var(--graupl-spacer-4)`.
28
- // - `.inline-5`: Sets the `inline-size` property to `var(--graupl-spacer-5)`.
29
- // - `.inline-6`: Sets the `inline-size` property to `var(--graupl-spacer-6)`.
30
- // - `.inline-7`: Sets the `inline-size` property to `var(--graupl-spacer-7)`.
31
- // - `.inline-8`: Sets the `inline-size` property to `var(--graupl-spacer-8)`.
32
- // - `.inline-9`: Sets the `inline-size` property to `var(--graupl-spacer-9)`.
33
- // - `.inline-10`: Sets the `inline-size` property to `var(--graupl-spacer-10)`.
34
- // - `.max-inline-auto`: Sets the `max-inline-size` property to `auto`.
35
- // - `.max-inline-fit-content`: Sets the `max-inline-size` property to `fit-content`.
36
- // - `.max-inline-max-content`: Sets the `max-inline-size` property to `max-content`.
37
- // - `.max-inline-min-content`: Sets the `max-inline-size` property to `min-content`.
38
- // - `.max-inline-stretch`: Sets the `max-inline-size` property to `stretch`.
39
- // - `.max-inline-full`: Sets the `max-inline-size` property to `100%`.
40
- // - `.max-inline-quarter`: Sets the `max-inline-size` property to `25%`.
41
- // - `.max-inline-half`: Sets the `max-inline-size` property to `50%`.
42
- // - `.max-inline-three-quarters`: Sets the `max-inline-size` property to `75%`.
43
- // - `.max-inline-third`: Sets the `max-inline-size` property to `calc(100% / 3)`.
44
- // - `.max-inline-two-thirds`: Sets the `max-inline-size` property to `calc(100% / 1.5)`.
45
- // - `.max-inline-half-screen`: Sets the `max-inline-size` property to `50vw`.
46
- // - `.max-inline-third-screen`: Sets the `max-inline-size` property to `calc(100vw / 3)`.
47
- // - `.max-inline-two-thirds-screen`: Sets the `max-inline-size` property to `calc(100vw / 1.5)`.
48
- // - `.max-inline-quarter-screen`: Sets the `max-inline-size` property to `25vw`.
49
- // - `.max-inline-three-quarters-screen`: Sets the `max-inline-size` property to `75vw`.
50
- // - `.max-inline-full-screen`: Sets the `max-inline-size` property to `100vw`.
51
- // - `.max-inline-0`: Sets the `max-inline-size` property to `var(--graupl-spacer-0)`.
52
- // - `.max-inline-1`: Sets the `max-inline-size` property to `var(--graupl-spacer-1)`.
53
- // - `.max-inline-2`: Sets the `max-inline-size` property to `var(--graupl-spacer-2)`.
54
- // - `.max-inline-3`: Sets the `max-inline-size` property to `var(--graupl-spacer-3)`.
55
- // - `.max-inline-4`: Sets the `max-inline-size` property to `var(--graupl-spacer-4)`.
56
- // - `.max-inline-5`: Sets the `max-inline-size` property to `var(--graupl-spacer-5)`.
57
- // - `.max-inline-6`: Sets the `max-inline-size` property to `var(--graupl-spacer-6)`.
58
- // - `.max-inline-7`: Sets the `max-inline-size` property to `var(--graupl-spacer-7)`.
59
- // - `.max-inline-8`: Sets the `max-inline-size` property to `var(--graupl-spacer-8)`.
60
- // - `.max-inline-9`: Sets the `max-inline-size` property to `var(--graupl-spacer-9)`.
61
- // - `.max-inline-10`: Sets the `max-inline-size` property to `var(--graupl-spacer-10)`.
62
- // - `.min-inline-auto`: Sets the `min-inline-size` property to `auto`.
63
- // - `.min-inline-fit-content`: Sets the `min-inline-size` property to `fit-content`.
64
- // - `.min-inline-max-content`: Sets the `min-inline-size` property to `max-content`.
65
- // - `.min-inline-min-content`: Sets the `min-inline-size` property to `min-content`.
66
- // - `.min-inline-stretch`: Sets the `min-inline-size` property to `stretch`.
67
- // - `.min-inline-full`: Sets the `min-inline-size` property to `100%`.
68
- // - `.min-inline-quarter`: Sets the `min-inline-size` property to `25%`.
69
- // - `.min-inline-half`: Sets the `min-inline-size` property to `50%`.
70
- // - `.min-inline-three-quarters`: Sets the `min-inline-size` property to `75%`.
71
- // - `.min-inline-third`: Sets the `min-inline-size` property to `calc(100% / 3)`.
72
- // - `.min-inline-two-thirds`: Sets the `min-inline-size` property to `calc(100% / 1.5)`.
73
- // - `.min-inline-half-screen`: Sets the `min-inline-size` property to `50vw`.
74
- // - `.min-inline-third-screen`: Sets the `min-inline-size` property to `calc(100vw / 3)`.
75
- // - `.min-inline-two-thirds-screen`: Sets the `min-inline-size` property to `calc(100vw / 1.5)`.
76
- // - `.min-inline-quarter-screen`: Sets the `min-inline-size` property to `25vw`.
77
- // - `.min-inline-three-quarters-screen`: Sets the `min-inline-size` property to `75vw`.
78
- // - `.min-inline-full-screen`: Sets the `min-inline-size` property to `100vw`.
79
- // - `.min-inline-0`: Sets the `min-inline-size` property to `var(--graupl-spacer-0)`.
80
- // - `.min-inline-1`: Sets the `min-inline-size` property to `var(--graupl-spacer-1)`.
81
- // - `.min-inline-2`: Sets the `min-inline-size` property to `var(--graupl-spacer-2)`.
82
- // - `.min-inline-3`: Sets the `min-inline-size` property to `var(--graupl-spacer-3)`.
83
- // - `.min-inline-4`: Sets the `min-inline-size` property to `var(--graupl-spacer-4)`.
84
- // - `.min-inline-5`: Sets the `min-inline-size` property to `var(--graupl-spacer-5)`.
85
- // - `.min-inline-6`: Sets the `min-inline-size` property to `var(--graupl-spacer-6)`.
86
- // - `.min-inline-7`: Sets the `min-inline-size` property to `var(--graupl-spacer-7)`.
87
- // - `.min-inline-8`: Sets the `min-inline-size` property to `var(--graupl-spacer-8)`.
88
- // - `.min-inline-9`: Sets the `min-inline-size` property to `var(--graupl-spacer-9)`.
89
- // - `.min-inline-10`: Sets the `min-inline-size` property to `var(--graupl-spacer-10)`.
6
+ // - `.is-auto`: Sets the `inline-size` property to `auto`.
7
+ // - `.is-fit-content`: Sets the `inline-size` property to `fit-content`.
8
+ // - `.is-max-content`: Sets the `inline-size` property to `max-content`.
9
+ // - `.is-min-content`: Sets the `inline-size` property to `min-content`.
10
+ // - `.is-stretch`: Sets the `inline-size` property to `stretch`.
11
+ // - `.is-full`: Sets the `inline-size` property to `100%`.
12
+ // - `.is-quarter`: Sets the `inline-size` property to `25%`.
13
+ // - `.is-half`: Sets the `inline-size` property to `50%`.
14
+ // - `.is-three-quarters`: Sets the `inline-size` property to `75%`.
15
+ // - `.is-third`: Sets the `inline-size` property to `calc(100% / 3)`.
16
+ // - `.is-two-thirds`: Sets the `inline-size` property to `calc(100% / 1.5)`.
17
+ // - `.is-half-screen`: Sets the `inline-size` property to `50vw`.
18
+ // - `.is-third-screen`: Sets the `inline-size` property to `calc(100vw / 3)`.
19
+ // - `.is-two-thirds-screen`: Sets the `inline-size` property to `calc(100vw / 1.5)`.
20
+ // - `.is-quarter-screen`: Sets the `inline-size` property to `25vw`.
21
+ // - `.is-three-quarters-screen`: Sets the `inline-size` property to `75vw`.
22
+ // - `.is-full-screen`: Sets the `inline-size` property to `100vw`.
23
+ // - `.is-0`: Sets the `inline-size` property to `var(--graupl-spacer-0)`.
24
+ // - `.is-1`: Sets the `inline-size` property to `var(--graupl-spacer-1)`.
25
+ // - `.is-2`: Sets the `inline-size` property to `var(--graupl-spacer-2)`.
26
+ // - `.is-3`: Sets the `inline-size` property to `var(--graupl-spacer-3)`.
27
+ // - `.is-4`: Sets the `inline-size` property to `var(--graupl-spacer-4)`.
28
+ // - `.is-5`: Sets the `inline-size` property to `var(--graupl-spacer-5)`.
29
+ // - `.is-6`: Sets the `inline-size` property to `var(--graupl-spacer-6)`.
30
+ // - `.is-7`: Sets the `inline-size` property to `var(--graupl-spacer-7)`.
31
+ // - `.is-8`: Sets the `inline-size` property to `var(--graupl-spacer-8)`.
32
+ // - `.is-9`: Sets the `inline-size` property to `var(--graupl-spacer-9)`.
33
+ // - `.is-10`: Sets the `inline-size` property to `var(--graupl-spacer-10)`.
34
+ // - `.max-is-auto`: Sets the `max-inline-size` property to `auto`.
35
+ // - `.max-is-fit-content`: Sets the `max-inline-size` property to `fit-content`.
36
+ // - `.max-is-max-content`: Sets the `max-inline-size` property to `max-content`.
37
+ // - `.max-is-min-content`: Sets the `max-inline-size` property to `min-content`.
38
+ // - `.max-is-stretch`: Sets the `max-inline-size` property to `stretch`.
39
+ // - `.max-is-full`: Sets the `max-inline-size` property to `100%`.
40
+ // - `.max-is-quarter`: Sets the `max-inline-size` property to `25%`.
41
+ // - `.max-is-half`: Sets the `max-inline-size` property to `50%`.
42
+ // - `.max-is-three-quarters`: Sets the `max-inline-size` property to `75%`.
43
+ // - `.max-is-third`: Sets the `max-inline-size` property to `calc(100% / 3)`.
44
+ // - `.max-is-two-thirds`: Sets the `max-inline-size` property to `calc(100% / 1.5)`.
45
+ // - `.max-is-half-screen`: Sets the `max-inline-size` property to `50vw`.
46
+ // - `.max-is-third-screen`: Sets the `max-inline-size` property to `calc(100vw / 3)`.
47
+ // - `.max-is-two-thirds-screen`: Sets the `max-inline-size` property to `calc(100vw / 1.5)`.
48
+ // - `.max-is-quarter-screen`: Sets the `max-inline-size` property to `25vw`.
49
+ // - `.max-is-three-quarters-screen`: Sets the `max-inline-size` property to `75vw`.
50
+ // - `.max-is-full-screen`: Sets the `max-inline-size` property to `100vw`.
51
+ // - `.max-is-0`: Sets the `max-inline-size` property to `var(--graupl-spacer-0)`.
52
+ // - `.max-is-1`: Sets the `max-inline-size` property to `var(--graupl-spacer-1)`.
53
+ // - `.max-is-2`: Sets the `max-inline-size` property to `var(--graupl-spacer-2)`.
54
+ // - `.max-is-3`: Sets the `max-inline-size` property to `var(--graupl-spacer-3)`.
55
+ // - `.max-is-4`: Sets the `max-inline-size` property to `var(--graupl-spacer-4)`.
56
+ // - `.max-is-5`: Sets the `max-inline-size` property to `var(--graupl-spacer-5)`.
57
+ // - `.max-is-6`: Sets the `max-inline-size` property to `var(--graupl-spacer-6)`.
58
+ // - `.max-is-7`: Sets the `max-inline-size` property to `var(--graupl-spacer-7)`.
59
+ // - `.max-is-8`: Sets the `max-inline-size` property to `var(--graupl-spacer-8)`.
60
+ // - `.max-is-9`: Sets the `max-inline-size` property to `var(--graupl-spacer-9)`.
61
+ // - `.max-is-10`: Sets the `max-inline-size` property to `var(--graupl-spacer-10)`.
62
+ // - `.min-is-auto`: Sets the `min-inline-size` property to `auto`.
63
+ // - `.min-is-fit-content`: Sets the `min-inline-size` property to `fit-content`.
64
+ // - `.min-is-max-content`: Sets the `min-inline-size` property to `max-content`.
65
+ // - `.min-is-min-content`: Sets the `min-inline-size` property to `min-content`.
66
+ // - `.min-is-stretch`: Sets the `min-inline-size` property to `stretch`.
67
+ // - `.min-is-full`: Sets the `min-inline-size` property to `100%`.
68
+ // - `.min-is-quarter`: Sets the `min-inline-size` property to `25%`.
69
+ // - `.min-is-half`: Sets the `min-inline-size` property to `50%`.
70
+ // - `.min-is-three-quarters`: Sets the `min-inline-size` property to `75%`.
71
+ // - `.min-is-third`: Sets the `min-inline-size` property to `calc(100% / 3)`.
72
+ // - `.min-is-two-thirds`: Sets the `min-inline-size` property to `calc(100% / 1.5)`.
73
+ // - `.min-is-half-screen`: Sets the `min-inline-size` property to `50vw`.
74
+ // - `.min-is-third-screen`: Sets the `min-inline-size` property to `calc(100vw / 3)`.
75
+ // - `.min-is-two-thirds-screen`: Sets the `min-inline-size` property to `calc(100vw / 1.5)`.
76
+ // - `.min-is-quarter-screen`: Sets the `min-inline-size` property to `25vw`.
77
+ // - `.min-is-three-quarters-screen`: Sets the `min-inline-size` property to `75vw`.
78
+ // - `.min-is-full-screen`: Sets the `min-inline-size` property to `100vw`.
79
+ // - `.min-is-0`: Sets the `min-inline-size` property to `var(--graupl-spacer-0)`.
80
+ // - `.min-is-1`: Sets the `min-inline-size` property to `var(--graupl-spacer-1)`.
81
+ // - `.min-is-2`: Sets the `min-inline-size` property to `var(--graupl-spacer-2)`.
82
+ // - `.min-is-3`: Sets the `min-inline-size` property to `var(--graupl-spacer-3)`.
83
+ // - `.min-is-4`: Sets the `min-inline-size` property to `var(--graupl-spacer-4)`.
84
+ // - `.min-is-5`: Sets the `min-inline-size` property to `var(--graupl-spacer-5)`.
85
+ // - `.min-is-6`: Sets the `min-inline-size` property to `var(--graupl-spacer-6)`.
86
+ // - `.min-is-7`: Sets the `min-inline-size` property to `var(--graupl-spacer-7)`.
87
+ // - `.min-is-8`: Sets the `min-inline-size` property to `var(--graupl-spacer-8)`.
88
+ // - `.min-is-9`: Sets the `min-inline-size` property to `var(--graupl-spacer-9)`.
89
+ // - `.min-is-10`: Sets the `min-inline-size` property to `var(--graupl-spacer-10)`.
90
90
  //
91
91
  // The following custom properties control the generated classes:
92
92
  // | Property | Description | Default Value |