yummacss 2.0.0 → 3.0.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 (66) hide show
  1. package/LICENSE +17 -18
  2. package/README.md +22 -43
  3. package/dist/cli/commands/build.js +44 -0
  4. package/dist/cli/commands/init.js +17 -0
  5. package/dist/cli/commands/watch.js +36 -0
  6. package/dist/cli/config/defaultConfig.js +8 -0
  7. package/dist/cli/services/configLoader.js +16 -0
  8. package/dist/cli/services/minifyService.js +16 -0
  9. package/dist/cli/services/purgeService.js +12 -0
  10. package/dist/cli/services/scssCompiler.js +34 -0
  11. package/dist/cli/src/cli.js +19 -0
  12. package/dist/cli/utils/cli-ui.js +13 -0
  13. package/dist/cli/utils/ui.js +15 -0
  14. package/dist/yumma.css +127316 -193522
  15. package/dist/yumma.min.css +1 -1
  16. package/package.json +50 -34
  17. package/src/_fonts.scss +8 -6
  18. package/src/abstracts/_breakpoints.scss +12 -10
  19. package/src/abstracts/_index.scss +5 -0
  20. package/src/abstracts/_theme.scss +21 -0
  21. package/src/abstracts/_variables.scss +69 -88
  22. package/src/abstracts/functions/_create-values.scss +16 -0
  23. package/src/abstracts/functions/_ignore-neutral.scss +9 -0
  24. package/src/abstracts/functions/_index.scss +2 -0
  25. package/src/abstracts/mixins/_create-colors.scss +39 -0
  26. package/src/abstracts/mixins/_create-utilities.scss +39 -0
  27. package/src/abstracts/mixins/_extend-utilities.scss +24 -0
  28. package/src/abstracts/mixins/_index.scss +3 -0
  29. package/src/reset/_stylecent.scss +235 -0
  30. package/src/utilities/_background.scss +95 -0
  31. package/src/utilities/_border.scss +313 -0
  32. package/src/utilities/_box-model.scss +290 -0
  33. package/src/utilities/_color.scss +85 -0
  34. package/src/utilities/_effect.scss +98 -0
  35. package/src/utilities/_flexbox.scss +258 -0
  36. package/src/utilities/_grid.scss +277 -0
  37. package/src/utilities/_index.scss +14 -0
  38. package/src/utilities/_interactivity.scss +304 -0
  39. package/src/utilities/_outline.scss +53 -0
  40. package/src/utilities/_positioning.scss +436 -0
  41. package/src/utilities/_svg.scss +27 -0
  42. package/src/utilities/_table.scss +35 -0
  43. package/src/utilities/_transform.scss +164 -0
  44. package/src/utilities/_typography.scss +278 -0
  45. package/src/utilities/maps/_index.scss +12 -0
  46. package/src/utilities/maps/box-model/_dimension.scss +16 -0
  47. package/src/utilities/maps/box-model/_height.scss +16 -0
  48. package/src/utilities/maps/box-model/_margin.scss +10 -0
  49. package/src/utilities/maps/box-model/_padding.scss +10 -0
  50. package/src/utilities/maps/box-model/_width.scss +16 -0
  51. package/src/utilities/maps/flexbox/_flex-basis.scss +12 -0
  52. package/src/utilities/maps/grid/_gap.scss +5 -0
  53. package/src/yummacss-core.scss +3 -0
  54. package/src/yummacss.scss +4 -0
  55. package/CHANGELOG.md +0 -73
  56. package/dist/yumma-core.css +0 -241423
  57. package/dist/yumma-core.min.css +0 -1
  58. package/gulpfile.js +0 -44
  59. package/src/_stylecent.scss +0 -68
  60. package/src/_utilities.scss +0 -1265
  61. package/src/abstracts/_colors.scss +0 -29
  62. package/src/abstracts/_functions.scss +0 -4
  63. package/src/abstracts/_layout.scss +0 -18
  64. package/src/abstracts/_mixins.scss +0 -589
  65. package/src/core.scss +0 -3
  66. package/src/yumma.scss +0 -10
package/src/utilities/_flexbox.scss ADDED
@@ -0,0 +1,258 @@
1
+ @use "sass:math";
2
+ @use "sass:map";
3
+ @use "../abstracts/variables" as vars;
4
+ @use "../abstracts/mixins/" as mix;
5
+ @use "../utilities/maps/" as maps;
6
+
7
+ $yma-flexbox-utils: (
8
+ "align-content": (
9
+ "prefix": "ac",
10
+ "properties": (
11
+ "align-content",
12
+ ),
13
+ "values": (
14
+ "b": baseline,
15
+ "c": center,
16
+ "fe": flex-end,
17
+ "fs": flex-start,
18
+ "n": normal,
19
+ "st": stretch,
20
+ "sa": space-around,
21
+ "sb": space-between,
22
+ "se": space-evenly,
23
+ ),
24
+ ),
25
+
26
+ "align-items": (
27
+ "prefix": "ai",
28
+ "properties": (
29
+ "align-items",
30
+ ),
31
+ "values": (
32
+ "b": baseline,
33
+ "c": center,
34
+ "fe": flex-end,
35
+ "fs": flex-start,
36
+ "st": stretch,
37
+ ),
38
+ ),
39
+
40
+ "align-self": (
41
+ "prefix": "as",
42
+ "properties": (
43
+ "align-self",
44
+ ),
45
+ "values": (
46
+ "auto": auto,
47
+ "b": baseline,
48
+ "c": center,
49
+ "fe": flex-end,
50
+ "fs": flex-start,
51
+ "st": stretch,
52
+ ),
53
+ ),
54
+
55
+ "flex-basis": (
56
+ "prefix": "fb",
57
+ "properties": (
58
+ "flex-basis",
59
+ ),
60
+ "values": maps.$yma-flex-basis-map,
61
+ ),
62
+
63
+ "flex-direction": (
64
+ "prefix": "fd",
65
+ "properties": (
66
+ "flex-direction",
67
+ ),
68
+ "values": (
69
+ "c": column,
70
+ "cr": column-reverse,
71
+ "r": row,
72
+ "rr": row-reverse,
73
+ ),
74
+ ),
75
+
76
+ "flex-grow": (
77
+ "prefix": "fg",
78
+ "properties": (
79
+ "flex-grow",
80
+ ),
81
+ "values": (
82
+ "0": 0,
83
+ "1": 1,
84
+ "2": 2,
85
+ "3": 3,
86
+ "4": 4,
87
+ "5": 5,
88
+ "6": 6,
89
+ "7": 7,
90
+ "8": 8,
91
+ ),
92
+ ),
93
+
94
+ "flex-shrink": (
95
+ "prefix": "fs",
96
+ "properties": (
97
+ "flex-shrink",
98
+ ),
99
+ "values": (
100
+ "0": 0,
101
+ "1": 1,
102
+ "2": 2,
103
+ "3": 3,
104
+ "4": 4,
105
+ "5": 5,
106
+ "6": 6,
107
+ "7": 7,
108
+ "8": 8,
109
+ ),
110
+ ),
111
+
112
+ "flex-wrap": (
113
+ "prefix": "fw",
114
+ "properties": (
115
+ "flex-wrap",
116
+ ),
117
+ "values": (
118
+ "nw": nowrap,
119
+ "w": wrap,
120
+ "wr": wrap-reverse,
121
+ ),
122
+ ),
123
+
124
+ "flex": (
125
+ "prefix": "f",
126
+ "properties": (
127
+ "flex",
128
+ ),
129
+ "values": (
130
+ "1": 1 1 0%,
131
+ "2": 2 2 0%,
132
+ "3": 3 3 0%,
133
+ "4": 4 4 0%,
134
+ "5": 5 5 0%,
135
+ "6": 6 6 0%,
136
+ "auto": 1 1 auto,
137
+ "none": none,
138
+ ),
139
+ ),
140
+
141
+ "justify-content": (
142
+ "prefix": "jc",
143
+ "properties": (
144
+ "justify-content",
145
+ ),
146
+ "values": (
147
+ "c": center,
148
+ "fe": flex-end,
149
+ "fs": flex-start,
150
+ "n": normal,
151
+ "st": stretch,
152
+ "sa": space-around,
153
+ "sb": space-between,
154
+ "se": space-evenly,
155
+ ),
156
+ ),
157
+
158
+ "justify-items": (
159
+ "prefix": "ji",
160
+ "properties": (
161
+ "justify-items",
162
+ ),
163
+ "values": (
164
+ "c": center,
165
+ "e": end,
166
+ "s": start,
167
+ "st": stretch,
168
+ ),
169
+ ),
170
+
171
+ "justify-self": (
172
+ "prefix": "js",
173
+ "properties": (
174
+ "justify-self",
175
+ ),
176
+ "values": (
177
+ "auto": auto,
178
+ "c": center,
179
+ "e": end,
180
+ "s": start,
181
+ "st": stretch,
182
+ ),
183
+ ),
184
+
185
+ "order": (
186
+ "prefix": "or",
187
+ "properties": (
188
+ "order",
189
+ ),
190
+ "values": (
191
+ "l": -9999,
192
+ "0": 0,
193
+ "1": 1,
194
+ "2": 2,
195
+ "3": 3,
196
+ "4": 4,
197
+ "5": 5,
198
+ "6": 6,
199
+ "7": 7,
200
+ "8": 8,
201
+ "9": 9,
202
+ "10": 1,
203
+ "f": 9999,
204
+ ),
205
+ ),
206
+
207
+ "place-content": (
208
+ "prefix": "pc",
209
+ "properties": (
210
+ "place-content",
211
+ ),
212
+ "values": (
213
+ "b": baseline,
214
+ "c": center,
215
+ "e": end,
216
+ "s": start,
217
+ "sa": space-around,
218
+ "sb": space-between,
219
+ "se": space-evenly,
220
+ "st": stretch,
221
+ ),
222
+ ),
223
+
224
+ "place-items": (
225
+ "prefix": "pi",
226
+ "properties": (
227
+ "place-items",
228
+ ),
229
+ "values": (
230
+ "b": baseline,
231
+ "c": center,
232
+ "e": end,
233
+ "s": start,
234
+ "st": stretch,
235
+ ),
236
+ ),
237
+
238
+ "place-self": (
239
+ "prefix": "ps",
240
+ "properties": (
241
+ "place-self",
242
+ ),
243
+ "values": (
244
+ "auto": auto,
245
+ "c": center,
246
+ "e": end,
247
+ "s": start,
248
+ "st": stretch,
249
+ ),
250
+ ),
251
+ );
252
+
253
+ @each $name, $map in $yma-flexbox-utils {
254
+ $prefix: map.get($map, "prefix");
255
+ $properties: map.get($map, "properties");
256
+
257
+ @include mix.create-utilities($map, $prefix, $properties);
258
+ }
package/src/utilities/_grid.scss ADDED
@@ -0,0 +1,277 @@
1
+ @use "sass:math";
2
+ @use "sass:map";
3
+ @use "sass:meta";
4
+ @use "../abstracts/variables" as vars;
5
+ @use "../abstracts/mixins/" as mix;
6
+ @use "../utilities/maps/" as maps;
7
+
8
+ $yma-grid-utils: (
9
+ "column-gap": (
10
+ "prefix": "cg",
11
+ "properties": (
12
+ "column-gap",
13
+ ),
14
+ "values": maps.$yma-gap-map,
15
+ ),
16
+
17
+ "gap": (
18
+ "prefix": "g",
19
+ "properties": (
20
+ "gap",
21
+ ),
22
+ "values": maps.$yma-gap-map,
23
+ ),
24
+
25
+ "grid-auto-columns": (
26
+ "prefix": "gac",
27
+ "properties": (
28
+ "grid-auto-columns",
29
+ ),
30
+ "values": (
31
+ "auto": auto,
32
+ "max": max-content,
33
+ "min": min-content,
34
+ ),
35
+ ),
36
+
37
+ "grid-auto-flow": (
38
+ "prefix": "gaf",
39
+ "properties": (
40
+ "grid-auto-flow",
41
+ ),
42
+ "values": (
43
+ "c": column,
44
+ "cd": column dense,
45
+ "d": dense,
46
+ "r": row,
47
+ "rd": row dense,
48
+ ),
49
+ ),
50
+
51
+ "grid-auto-rows": (
52
+ "prefix": "gar",
53
+ "properties": (
54
+ "grid-auto-rows",
55
+ ),
56
+ "values": (
57
+ "auto": auto,
58
+ "max": max-content,
59
+ "min": min-content,
60
+ ),
61
+ ),
62
+
63
+ "grid-column": (
64
+ "prefix": "gc-s",
65
+ "properties": (
66
+ "grid-column",
67
+ ),
68
+ "values": (
69
+ "1": span 1 / span 1,
70
+ "2": span 2 / span 2,
71
+ "3": span 3 / span 3,
72
+ "4": span 4 / span 4,
73
+ "5": span 5 / span 5,
74
+ "6": span 6 / span 6,
75
+ "7": span 7 / span 7,
76
+ "8": span 8 / span 8,
77
+ "9": span 9 / span 9,
78
+ "10": span 10 / span 10,
79
+ "11": span 11 / span 11,
80
+ "12": span 12 / span 12,
81
+ "13": span 13 / span 13,
82
+ "14": span 14 / span 14,
83
+ "15": span 15 / span 15,
84
+ "16": span 16 / span 16,
85
+ ),
86
+ ),
87
+
88
+ "grid-column-end": (
89
+ "prefix": "gce",
90
+ "properties": (
91
+ "grid-column-end",
92
+ ),
93
+ "values": (
94
+ "1": 1,
95
+ "2": 2,
96
+ "3": 3,
97
+ "4": 4,
98
+ "5": 5,
99
+ "6": 6,
100
+ "7": 7,
101
+ "8": 8,
102
+ "9": 9,
103
+ "10": 10,
104
+ "11": 11,
105
+ "12": 12,
106
+ "13": 13,
107
+ "14": 14,
108
+ "15": 15,
109
+ "16": 16,
110
+ ),
111
+ ),
112
+
113
+ "grid-column-start": (
114
+ "prefix": "gcs",
115
+ "properties": (
116
+ "grid-column-start",
117
+ ),
118
+ "values": (
119
+ "1": 1,
120
+ "2": 2,
121
+ "3": 3,
122
+ "4": 4,
123
+ "5": 5,
124
+ "6": 6,
125
+ "7": 7,
126
+ "8": 8,
127
+ "9": 9,
128
+ "10": 10,
129
+ "11": 11,
130
+ "12": 12,
131
+ "13": 13,
132
+ "14": 14,
133
+ "15": 15,
134
+ "16": 16,
135
+ ),
136
+ ),
137
+
138
+ "grid-row": (
139
+ "prefix": "gr-s",
140
+ "properties": (
141
+ "grid-row",
142
+ ),
143
+ "values": (
144
+ "1": span 1 / span 1,
145
+ "2": span 2 / span 2,
146
+ "3": span 3 / span 3,
147
+ "4": span 4 / span 4,
148
+ "5": span 5 / span 5,
149
+ "6": span 6 / span 6,
150
+ "7": span 7 / span 7,
151
+ "8": span 8 / span 8,
152
+ "9": span 9 / span 9,
153
+ "10": span 10 / span 10,
154
+ "11": span 11 / span 11,
155
+ "12": span 12 / span 12,
156
+ "13": span 13 / span 13,
157
+ "14": span 14 / span 14,
158
+ "15": span 15 / span 15,
159
+ "16": span 16 / span 16,
160
+ ),
161
+ ),
162
+
163
+ "grid-row-end": (
164
+ "prefix": "gre",
165
+ "properties": (
166
+ "grid-row-end",
167
+ ),
168
+ "values": (
169
+ "1": 1,
170
+ "2": 2,
171
+ "3": 3,
172
+ "4": 4,
173
+ "5": 5,
174
+ "6": 6,
175
+ "7": 7,
176
+ "8": 8,
177
+ "9": 9,
178
+ "10": 10,
179
+ "11": 11,
180
+ "12": 12,
181
+ "13": 13,
182
+ "14": 14,
183
+ "15": 15,
184
+ "16": 16,
185
+ ),
186
+ ),
187
+
188
+ "grid-row-start": (
189
+ "prefix": "grs",
190
+ "properties": (
191
+ "grid-row-start",
192
+ ),
193
+ "values": (
194
+ "1": 1,
195
+ "2": 2,
196
+ "3": 3,
197
+ "4": 4,
198
+ "5": 5,
199
+ "6": 6,
200
+ "7": 7,
201
+ "8": 8,
202
+ "9": 9,
203
+ "10": 10,
204
+ "11": 11,
205
+ "12": 12,
206
+ "13": 13,
207
+ "14": 14,
208
+ "15": 15,
209
+ "16": 16,
210
+ ),
211
+ ),
212
+
213
+ "grid-template-columns": (
214
+ "prefix": "gtc",
215
+ "properties": (
216
+ "grid-template-columns",
217
+ ),
218
+ "values": (
219
+ "1": repeat(1, minmax(0, 1fr)),
220
+ "2": repeat(2, minmax(0, 1fr)),
221
+ "3": repeat(3, minmax(0, 1fr)),
222
+ "4": repeat(4, minmax(0, 1fr)),
223
+ "5": repeat(5, minmax(0, 1fr)),
224
+ "6": repeat(6, minmax(0, 1fr)),
225
+ "7": repeat(7, minmax(0, 1fr)),
226
+ "8": repeat(8, minmax(0, 1fr)),
227
+ "9": repeat(9, minmax(0, 1fr)),
228
+ "10": repeat(10, minmax(0, 1fr)),
229
+ "11": repeat(11, minmax(0, 1fr)),
230
+ "12": repeat(12, minmax(0, 1fr)),
231
+ "13": repeat(13, minmax(0, 1fr)),
232
+ "14": repeat(14, minmax(0, 1fr)),
233
+ "15": repeat(15, minmax(0, 1fr)),
234
+ "16": repeat(16, minmax(0, 1fr)),
235
+ ),
236
+ ),
237
+
238
+ "grid-template-rows": (
239
+ "prefix": "gtr",
240
+ "properties": (
241
+ "grid-template-rows",
242
+ ),
243
+ "values": (
244
+ "1": repeat(1, minmax(0, 1fr)),
245
+ "2": repeat(2, minmax(0, 1fr)),
246
+ "3": repeat(3, minmax(0, 1fr)),
247
+ "4": repeat(4, minmax(0, 1fr)),
248
+ "5": repeat(5, minmax(0, 1fr)),
249
+ "6": repeat(6, minmax(0, 1fr)),
250
+ "7": repeat(7, minmax(0, 1fr)),
251
+ "8": repeat(8, minmax(0, 1fr)),
252
+ "9": repeat(9, minmax(0, 1fr)),
253
+ "10": repeat(10, minmax(0, 1fr)),
254
+ "11": repeat(11, minmax(0, 1fr)),
255
+ "12": repeat(12, minmax(0, 1fr)),
256
+ "13": repeat(13, minmax(0, 1fr)),
257
+ "14": repeat(14, minmax(0, 1fr)),
258
+ "15": repeat(15, minmax(0, 1fr)),
259
+ "16": repeat(16, minmax(0, 1fr)),
260
+ ),
261
+ ),
262
+
263
+ "row-gap": (
264
+ "prefix": "rg",
265
+ "properties": (
266
+ "row-gap",
267
+ ),
268
+ "values": maps.$yma-gap-map,
269
+ ),
270
+ );
271
+
272
+ @each $name, $map in $yma-grid-utils {
273
+ $prefix: map.get($map, "prefix");
274
+ $properties: map.get($map, "properties");
275
+
276
+ @include mix.create-utilities($map, $prefix, $properties);
277
+ }
package/src/utilities/_index.scss ADDED
@@ -0,0 +1,14 @@
1
+ @forward "background";
2
+ @forward "border";
3
+ @forward "box-model";
4
+ @forward "color";
5
+ @forward "effect";
6
+ @forward "flexbox";
7
+ @forward "grid";
8
+ @forward "interactivity";
9
+ @forward "positioning";
10
+ @forward "outline";
11
+ @forward "svg";
12
+ @forward "table";
13
+ @forward "transform";
14
+ @forward "typography";