postcss-enumerates-in-line 0.1.1 → 0.3.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.
- package/README.img/default_color.png +0 -0
- package/README.md +385 -12
- package/README_EN.md +385 -11
- package/_color.scss +138 -0
- package/index.mjs +196 -34
- package/package.json +1 -1
- package/test/gulp/src/css/app.scss +10 -22
- package/test/postcss/src/css/app.scss +10 -22
package/index.mjs
CHANGED
|
@@ -49,34 +49,46 @@ let defaultStyle = [
|
|
|
49
49
|
]
|
|
50
50
|
defaultStyle.reverse()
|
|
51
51
|
|
|
52
|
-
const defaultColorNames = ['
|
|
52
|
+
const defaultColorNames = ['black', 'white', 'base', 'red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'purple', 'magenta']
|
|
53
53
|
const defaultColorDefines = {
|
|
54
54
|
rgb: {
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
55
|
+
black: [[0, '#100F0F'], [999, '#000000']],
|
|
56
|
+
white: [[0, '#FFFCF0'], [999, '#FFFFFF']],
|
|
57
|
+
base: [[50, '#F2F0E5'], [100, '#E6E4D9'], [150, '#DAD8CE'], [200, '#CECDC3'], [300, '#B7B5AC'], [400, '#9F9D96'], [500, '#878580'], [600, '#6F6E69'], [700, '#575653'], [800, '#403E3C'], [850, '#343331'], [900, '#282726'], [950, '#1C1B1A']],
|
|
58
|
+
red: [[50, '#FFE1D5'], [100, '#FFCABB'], [150, '#FDB2A2'], [200, '#F89A8A'], [300, '#E8705F'], [400, '#D14D41'], [500, '#C03E35'], [600, '#AF3029'], [700, '#942822'], [800, '#6C201C'], [850, '#551B18'], [900, '#3E1715'], [950, '#261312']],
|
|
59
|
+
orange: [[50, '#FFE7CE'], [100, '#FED3AF'], [150, '#FCC192'], [200, '#F9AE77'], [300, '#EC8B49'], [400, '#DA702C'], [500, '#CB6120'], [600, '#BC5215'], [700, '#9D4310'], [800, '#71320D'], [850, '#59290D'], [900, '#40200D'], [950, '#27180E']],
|
|
60
|
+
yellow: [[50, '#FAEEC6'], [100, '#F6E2A0'], [150, '#F1D67E'], [200, '#ECCB60'], [300, '#DFB431'], [400, '#D0A215'], [500, '#BE9207'], [600, '#AD8301'], [700, '#8E6B01'], [800, '#664D01'], [850, '#503D02'], [900, '#3A2D04'], [950, '#241E08']],
|
|
61
|
+
green: [[50, '#EDEECF'], [100, '#DDE2B2'], [150, '#CDD597'], [200, '#BEC97E'], [300, '#A0AF54'], [400, '#879A39'], [500, '#768D21'], [600, '#66800B'], [700, '#536907'], [800, '#3D4C07'], [850, '#313D07'], [900, '#252D09'], [950, '#1A1E0C']],
|
|
62
|
+
cyan: [[50, '#DDF1E4'], [100, '#BFE8D9'], [150, '#A2DECE'], [200, '#87D3C3'], [300, '#5ABDAC'], [400, '#3AA99F'], [500, '#2F968D'], [600, '#24837B'], [700, '#1C6C66'], [800, '#164F4A'], [850, '#143F3C'], [900, '#122F2C'], [950, '#101F1D']],
|
|
63
|
+
blue: [[50, '#E1ECEB'], [100, '#C6DDE8'], [150, '#ABCFE2'], [200, '#92BFDB'], [300, '#66A0C8'], [400, '#4385BE'], [500, '#3171B2'], [600, '#205EA6'], [700, '#1A4F8C'], [800, '#163B66'], [850, '#133051'], [900, '#12253B'], [950, '#101A24']],
|
|
64
|
+
purple: [[50, '#F0EAEC'], [100, '#E2D9E9'], [150, '#D3CAE6'], [200, '#C4B9E0'], [300, '#A699D0'], [400, '#8B7EC8'], [500, '#735EB5'], [600, '#5E409D'], [700, '#4F3685'], [800, '#3C2A62'], [850, '#31234E'], [900, '#261C39'], [950, '#1A1623']],
|
|
65
|
+
magenta: [[50, '#FEE4E5'], [100, '#FCCFDA'], [150, '#F9B9CF'], [200, '#F4A4C2'], [300, '#E47DA8'], [400, '#CE5D97'], [500, '#B74583'], [600, '#A02F6F'], [700, '#87285E'], [800, '#641F46'], [850, '#4F1B39'], [900, '#39172B'], [950, '#24131D']],
|
|
62
66
|
},
|
|
63
67
|
hsl: {
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
68
|
+
black: [[0, 'hsl(0 3.2% 6.1%)'], [999, 'hsl(0 0% 0%)']],
|
|
69
|
+
white: [[0, 'hsl(48 100% 97.1%)'], [999, 'hsl(0 0% 100%)']],
|
|
70
|
+
base: [[50, 'hsl(50.8 33.3% 92.4%)'], [100, 'hsl(50.8 20.6% 87.6%)'], [150, 'hsl(50 14% 83.1%)'], [200, 'hsl(54.5 10.1% 78.6%)'], [300, 'hsl(49.1 7.1% 69.6%)'], [400, 'hsl(46.7 4.5% 60.6%)'], [500, 'hsl(42.9 2.8% 51.6%)'], [600, 'hsl(50 2.8% 42.4%)'], [700, 'hsl(45 2.4% 33.3%)'], [800, 'hsl(30 3.2% 24.3%)'], [850, 'hsl(40 3% 19.8%)'], [900, 'hsl(30 2.6% 15.3%)'], [950, 'hsl(30 3.7% 10.6%)']],
|
|
71
|
+
red: [[50, 'hsl(17.1 100% 91.8%)'], [100, 'hsl(13.2 100% 86.7%)'], [150, 'hsl(10.5 95.8% 81.4%)'], [200, 'hsl(8.7 88.7% 75.7%)'], [300, 'hsl(7.4 74.9% 64.1%)'], [400, 'hsl(5 61% 53.7%)'], [500, 'hsl(3.9 56.7% 48%)'], [600, 'hsl(3.1 62% 42.4%)'], [700, 'hsl(3.2 62.6% 35.7%)'], [800, 'hsl(3 58.8% 26.7%)'], [850, 'hsl(3 56% 21.4%)'], [900, 'hsl(2.9,49.4%,16.3%)'], [950, 'hsl(3 35.7% 11%)']],
|
|
72
|
+
orange: [[50, 'hsl(30.6,100%,90.4%)'], [100, 'hsl(27.3 97.5% 84.1%)'], [150, 'hsl(26.6 94.6% 78%)'], [200, 'hsl(25.4 91.5% 72.2%)'], [300, 'hsl(24.3 81.1% 60.6%)'], [400, 'hsl(23.4 70.2% 51.4%)'], [500, 'hsl(22.8 72.8% 46.1%)'], [600, 'hsl(21.9 79.9% 41%)'], [700, 'hsl(21.7 81.5% 33.9%)'], [800, 'hsl(22.2 79.4% 24.7%)'], [850, 'hsl(22.1 74.5% 20%)'], [900, 'hsl(22.4 66.2% 15.1%)'], [950, 'hsl(24 47.2% 10.4%)']],
|
|
73
|
+
yellow: [[50, 'hsl(46.2 83.9% 87.8%)'], [100, 'hsl(46 82.7% 79.6%)'], [150, 'hsl(45.9 80.4% 72%)'], [200, 'hsl(45.9 78.7% 65.1%)'], [300, 'hsl(45.2 73.1% 53.3%)'], [400, 'hsl(45.2 81.7% 44.9%)'], [500, 'hsl(45.6 92.9% 38.6%)'], [600, 'hsl(45.3 98.9% 34.1%)'], [700, 'hsl(45.1 98.6% 28%)'], [800, 'hsl(45.1,98.1%,20.2%)'], [850, 'hsl(45.4 95.1% 16.1%)'], [900, 'hsl(45.6 87.1% 12.2%)'], [950, 'hsl(47.1 63.6% 8.6%)']],
|
|
74
|
+
green: [[50, 'hsl(61.9 47.7% 87.3%)'], [100, 'hsl(66.3 45.3% 79.2%)'], [150, 'hsl(67.7 42.5% 71.4%)'], [200, 'hsl(68.8 41% 64.1%)'], [300, 'hsl(69.9 36.3% 50.8%)'], [400, 'hsl(71.8 46% 41.4%)'], [500, 'hsl(72.8 62.1% 34.1%)'], [600, 'hsl(73.3 84.2% 27.3%)'], [700, 'hsl(73.5 87.5% 22%)'], [800, 'hsl(73 83.1% 16.3%)'], [850, 'hsl(73.3 79.4% 13.3%)'], [900, 'hsl(73.3 66.7% 10.6%)'], [950, 'hsl(73.3 42.9% 8.2%)']],
|
|
75
|
+
cyan: [[50, 'hsl(141 41.7% 90.6%)'], [100, 'hsl(158 47.1% 82.9%)'], [150, 'hsl(164 47.6% 75.3%)'], [200, 'hsl(167.4 46.3% 67.8%)'], [300, 'hsl(169.7 42.9% 54.7%)'], [400, 'hsl(174.6 48.9% 44.5%)'], [500, 'hsl(174.8 52.3% 38.6%)'], [600, 'hsl(174.9 56.9% 32.7%)'], [700, 'hsl(175.5 58.8% 26.7%)'], [800, 'hsl(174.7 56.4% 19.8%)'], [850, 'hsl(175.8 51.8% 16.3%)'], [900, 'hsl(173.8 44.6% 12.7%)'], [950, 'hsl(172 31.9% 9.2%)']],
|
|
76
|
+
blue: [[50, 'hsl(174.5 22.4% 90.4%)'], [100, 'hsl(199.4 42.5% 84.3%)'], [150, 'hsl(200.7 48.7% 77.8%)'], [200, 'hsl(203 50.3% 71.6%)'], [300, 'hsl(204.5 47.1% 59.2%)'], [400, 'hsl(207.8 48.6% 50.4%)'], [500, 'hsl(210.2 56.8% 44.5%)'], [600, 'hsl(212.2 67.7% 38.8%)'], [700, 'hsl(212.1 68.7% 32.5%)'], [800, 'hsl(212.3 64.5% 24.3%)'], [850, 'hsl(211.9 62% 19.6%)'], [900, 'hsl(212.2 53.2% 15.1%)'], [950, 'hsl(210 38.5% 10.2%)']],
|
|
77
|
+
purple: [[50, 'hsl(340 16.7% 92.9%)'], [100, 'hsl(273.8 26.7% 88.2%)'], [150, 'hsl(259.3 35.9% 84.7%)'], [200, 'hsl(256.9 38.6% 80.2%)'], [300, 'hsl(254.2 36.9% 70.8%)'], [400, 'hsl(250.5 40.2% 63.9%)'], [500, 'hsl(254.5 37% 53.9%)'], [600, 'hsl(259.4 42.1% 43.3%)'], [700, 'hsl(259 42.2% 36.7%)'], [800, 'hsl(259.3 40% 27.5%)'], [850, 'hsl(259.5 38.1% 22.2%)'], [900, 'hsl(260.7 34.1% 16.7%)'], [950, 'hsl(258.5 22.8% 11.2%)']],
|
|
78
|
+
magenta: [[50, 'hsl(357.7 92.9% 94.5%)'], [100, 'hsl(345.3 88.2% 90%)'], [150, 'hsl(339.4 84.2% 85.1%)'], [200, 'hsl(337.5 78.4% 80%)'], [300, 'hsl(335 65.6% 69.2%)'], [400, 'hsl(329.2 53.6% 58.6%)'], [500, 'hsl(327.4 45.2% 49.4%)'], [600, 'hsl(326 54.6% 40.6%)'], [700, 'hsl(325.9 54.3% 34.3%)'], [800, 'hsl(326.1 52.7% 25.7%)'], [850, 'hsl(325.4 49.1% 20.8%)'], [900, 'hsl(324.7 42.5% 15.7%)'], [950, 'hsl(324.7 30.9% 10.8%)']],
|
|
71
79
|
},
|
|
72
80
|
oklch: {
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
81
|
+
black: [[0, 'oklch(0.1696 0.0017 17.32)'], [999, 'oklch(0 0 0)']],
|
|
82
|
+
white: [[0, 'oklch(0.9901 0.0161 95.22)'], [999, 'oklch(1 0 0)']],
|
|
83
|
+
base: [[50, 'oklch(0.9537 0.0147 98.29)'], [100, 'oklch(0.9174 0.0149 98.3)'], [150, 'oklch(0.881 0.0137 97.46)'], [200, 'oklch(0.8463 0.0137 102.05)'], [300, 'oklch(0.7721 0.0128 96.47)'], [400, 'oklch(0.6956 0.0103 93.62)'], [500, 'oklch(0.6169 0.0078 88.67)'], [600, 'oklch(0.5375 0.0078 97.45)'], [700, 'oklch(0.4531 0.005 91.5)'], [800, 'oklch(0.3651 0.0044 67.69)'], [850, 'oklch(0.3214 0.0038 84.58)'], [900, 'oklch(0.2734 0.0023 67.73)'], [950, 'oklch(0.2228 0.0025 67.7)']],
|
|
84
|
+
red: [[50, 'oklch(0.9312 0.037 43.08)'], [100, 'oklch(0.8817 0.0641 36.36)'], [150, 'oklch(0.8306 0.0912 32.45)'], [200, 'oklch(0.7784 0.116 30.33)'], [300, 'oklch(0.6834 0.1523 29.79)'], [400, 'oklch(0.597 0.1692 28.38)'], [500, 'oklch(0.55 0.1678 27.88)'], [600, 'oklch(0.5042 0.1648 27.84)'], [700, 'oklch(0.4468 0.1448 27.78)'], [800, 'oklch(0.3633 0.1089 26.95)'], [850, 'oklch(0.3132 0.087 26.31)'], [900, 'oklch(0.2639 0.0618 25.14)'], [950, 'oklch(0.2133 0.0318 23.31)']],
|
|
85
|
+
orange: [[50, 'oklch(0.9409 0.0422 68.42)'], [100, 'oklch(0.8949 0.0678 61.72)'], [150, 'oklch(0.8534 0.0915 59.68)'], [200, 'oklch(0.8109 0.1131 56.61)'], [300, 'oklch(0.7282 0.143 52.66)'], [400, 'oklch(0.6576 0.1539 49.3)'], [500, 'oklch(0.6121 0.1533 47.37)'], [600, 'oklch(0.5665 0.1523 45.02)'], [700, 'oklch(0.4954 0.1334 44.79)'], [800, 'oklch(0.3971 0.1006 46.5)'], [850, 'oklch(0.3419 0.0807 47.52)'], [900, 'oklch(0.2832 0.0577 49.41)'], [950, 'oklch(0.2257 0.0302 54.27)']],
|
|
86
|
+
yellow: [[50, 'oklch(0.9486 0.0535 93.29)'], [100, 'oklch(0.9139 0.0866 93.23)'], [150, 'oklch(0.8801 0.1122 92.85)'], [200, 'oklch(0.8498 0.131 92.28)'], [300, 'oklch(0.7872 0.147 89.37)'], [400, 'oklch(0.7346 0.1462 87.46)'], [500, 'oklch(0.6828 0.1383 86.78)'], [600, 'oklch(0.6333 0.1295 85.81)'], [700, 'oklch(0.548 0.1119 85.82)'], [800, 'oklch(0.4347 0.0884 86.92)'], [850, 'oklch(0.3705 0.0744 88.38)'], [900, 'oklch(0.3036 0.0583 90.15)'], [950, 'oklch(0.2362 0.0369 94.23)']],
|
|
87
|
+
green: [[50, 'oklch(0.9403 0.0408 108.67)'], [100, 'oklch(0.8969 0.0633 112.51)'], [150, 'oklch(0.8519 0.0818 114.14)'], [200, 'oklch(0.81 0.0985 115.45)'], [300, 'oklch(0.7227 0.1178 117.2)'], [400, 'oklch(0.6513 0.1242 119.38)'], [500, 'oklch(0.6049 0.1321 121.21)'], [600, 'oklch(0.5593 0.1335 122.92)'], [700, 'oklch(0.4854 0.1161 123.03)'], [800, 'oklch(0.3898 0.09 122.07)'], [850, 'oklch(0.3376 0.0757 121.85)'], [900, 'oklch(0.2806 0.0564 120.9)'], [950, 'oklch(0.2253 0.0324 119.34)']],
|
|
88
|
+
cyan: [[50, 'oklch(0.9398 0.0273 157.36)'], [100, 'oklch(0.8977 0.0473 171)'], [150, 'oklch(0.8552 0.0652 176.36)'], [200, 'oklch(0.8127 0.0791 179.39)'], [300, 'oklch(0.734 0.0968 180.73)'], [400, 'oklch(0.6701 0.0999 186.58)'], [500, 'oklch(0.6129 0.0932 186.66)'], [600, 'oklch(0.5544 0.0863 186.74)'], [700, 'oklch(0.4831 0.075 187.62)'], [800, 'oklch(0.3898 0.0584 186.75)'], [850, 'oklch(0.3371 0.0472 188.78)'], [900, 'oklch(0.2818 0.0354 186.45)'], [950, 'oklch(0.225 0.021 185.21)']],
|
|
89
|
+
blue: [[50, 'oklch(0.9345 0.0118 190.43)'], [100, 'oklch(0.8839 0.0289 228.09)'], [150, 'oklch(0.8346 0.0466 231.04)'], [200, 'oklch(0.7823 0.0622 235.93)'], [300, 'oklch(0.6815 0.0849 239.8)'], [400, 'oklch(0.5988 0.1104 247)'], [500, 'oklch(0.539 0.1212 251.4)'], [600, 'oklch(0.4818 0.1315 254.79)'], [700, 'oklch(0.4269 0.1152 254.58)'], [800, 'oklch(0.3499 0.0862 254.23)'], [850, 'oklch(0.3056 0.0693 253.5)'], [900, 'oklch(0.2604 0.0486 253.24)'], [950, 'oklch(0.2132 0.0247 249.05)']],
|
|
90
|
+
purple: [[50, 'oklch(0.9423 0.007 354.8)'], [100, 'oklch(0.8972 0.0236 310.69)'], [150, 'oklch(0.8549 0.0395 300.22)'], [200, 'oklch(0.8075 0.0555 298.05)'], [300, 'oklch(0.7139 0.0802 295.14)'], [400, 'oklch(0.6348 0.1098 291)'], [500, 'oklch(0.5428 0.1326 292.54)'], [600, 'oklch(0.454 0.1451 294.83)'], [700, 'oklch(0.4041 0.1271 294.63)'], [800, 'oklch(0.3364 0.0955 295.65)'], [850, 'oklch(0.296 0.0764 296.46)'], [900, 'oklch(0.2538 0.0544 298.34)'], [950, 'oklch(0.2113 0.0259 298.28)']],
|
|
91
|
+
magenta: [[50, 'oklch(0.9402 0.0286 15.01)'], [100, 'oklch(0.8962 0.0525 1.83)'], [150, 'oklch(0.8505 0.0787 356.49)'], [200, 'oklch(0.8051 0.1012 355.47)'], [300, 'oklch(0.7155 0.1356 354.63)'], [400, 'oklch(0.6348 0.1565 350.47)'], [500, 'oklch(0.5637 0.1612 349.8)'], [600, 'oklch(0.4954 0.1614 349.76)'], [700, 'oklch(0.4399 0.1407 349.42)'], [800, 'oklch(0.3601 0.1089 349.03)'], [850, 'oklch(0.313 0.087 347.6)'], [900, 'oklch(0.2629 0.0611 345.81)'], [950, 'oklch(0.2145 0.0328 344.07)']],
|
|
80
92
|
},
|
|
81
93
|
}
|
|
82
94
|
|
|
@@ -117,21 +129,165 @@ export const enumSpreader = (options = {}) => {
|
|
|
117
129
|
rule.nodes.forEach(node => {
|
|
118
130
|
if((node.type === 'atrule') && (node.name === 'enums')) {
|
|
119
131
|
let param = node.params.replace(/[\s\t\r\n]+/g, ' ').split(' ')
|
|
120
|
-
param.reverse()
|
|
121
132
|
for(let i = 0, l = param.length; i < l; i ++) {
|
|
122
|
-
let
|
|
123
|
-
|
|
124
|
-
|
|
133
|
+
let setting = {
|
|
134
|
+
isHover: false,
|
|
135
|
+
isDark: false,
|
|
136
|
+
isMq: '',
|
|
137
|
+
isData: '',
|
|
138
|
+
isAria: '',
|
|
139
|
+
important: '',
|
|
140
|
+
prop: '',
|
|
141
|
+
value: '',
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
if(/hover!/.test(param[i])) {
|
|
145
|
+
setting.isHover = true
|
|
146
|
+
param[i] = param[i].replace(/hover!/g, '')
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
if(/dark!/.test(param[i])) {
|
|
150
|
+
setting.isDark = true
|
|
151
|
+
param[i] = param[i].replace(/dark!/g, '')
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
if(/mq\(.+?\)!/.test(param[i])) {
|
|
155
|
+
setting.isMq = []
|
|
156
|
+
;(!!param[i].match(/mq\((.+?)\)!/)[1] ? param[i].match(/mq\((.+?)\)!/)[1] : '').split(',').forEach(q => {
|
|
157
|
+
let kv = q.split(':')
|
|
158
|
+
if(kv.length === 2) {
|
|
159
|
+
switch(kv[0]) {
|
|
160
|
+
case 'aspect-ratio':
|
|
161
|
+
if(/^[\d\.]+$/.test(kv[1])) {
|
|
162
|
+
let match = kv[1].match(/^([\d\.]+)$/)
|
|
163
|
+
if(!!match[1]) {
|
|
164
|
+
setting.isMq.push(`(aspect-ratio: ${match[1]})`)
|
|
165
|
+
}
|
|
166
|
+
} else if(/^\-[\d\.]+$/.test(kv[1])) {
|
|
167
|
+
let match = kv[1].match(/^\-([\d\.]+)$/)
|
|
168
|
+
if(!!match[1]) {
|
|
169
|
+
setting.isMq.push(`(max-aspect-ratio: ${match[1]})`)
|
|
170
|
+
}
|
|
171
|
+
} else if(/^[\d\.]+\-$/.test(kv[1])) {
|
|
172
|
+
let match = kv[1].match(/^([\d\.]+)\-$/)
|
|
173
|
+
if(!!match[1]) {
|
|
174
|
+
setting.isMq.push(`(min-aspect-ratio: ${match[1]})`)
|
|
175
|
+
}
|
|
176
|
+
} else if(/^[\d\.]+\-[\d\.]+$/.test(kv[1])) {
|
|
177
|
+
let match = kv[1].match(/^([\d\.]+)\-([\d\.]+)$/)
|
|
178
|
+
if(!!match[1] && !!match[2]) {
|
|
179
|
+
setting.isMq.push(`(min-aspect-ratio: ${match[1]}) and (max-aspect-ratio: ${match[2]})`)
|
|
180
|
+
}
|
|
181
|
+
}
|
|
182
|
+
break;
|
|
183
|
+
case 'height':
|
|
184
|
+
if(/^[\d\.a-zA-Z]+$/.test(kv[1])) {
|
|
185
|
+
let match = kv[1].match(/^([\d\.a-zA-Z]+)$/)
|
|
186
|
+
if(!!match[1]) {
|
|
187
|
+
setting.isMq.push(`(height: ${match[1]})`)
|
|
188
|
+
}
|
|
189
|
+
} else if(/^\-[\d\.a-zA-Z]+$/.test(kv[1])) {
|
|
190
|
+
let match = kv[1].match(/^\-([\d\.a-zA-Z]+)$/)
|
|
191
|
+
if(!!match[1]) {
|
|
192
|
+
setting.isMq.push(`(max-height: ${match[1]})`)
|
|
193
|
+
}
|
|
194
|
+
} else if(/^[\d\.a-zA-Z]+\-$/.test(kv[1])) {
|
|
195
|
+
let match = kv[1].match(/^([\d\.a-zA-Z]+)\-$/)
|
|
196
|
+
if(!!match[1]) {
|
|
197
|
+
setting.isMq.push(`(min-height: ${match[1]})`)
|
|
198
|
+
}
|
|
199
|
+
} else if(/^[\d\.a-zA-Z]+\-[\d\.a-zA-Z]+$/.test(kv[1])) {
|
|
200
|
+
let match = kv[1].match(/^([\d\.a-zA-Z]+)\-([\d\.a-zA-Z]+)$/)
|
|
201
|
+
if(!!match[1] && !!match[2]) {
|
|
202
|
+
setting.isMq.push(`(min-height: ${match[1]}) and (max-height: ${match[2]})`)
|
|
203
|
+
}
|
|
204
|
+
}
|
|
205
|
+
break;
|
|
206
|
+
case 'orientation':
|
|
207
|
+
if(/^portrait$/.test(kv[1])) {
|
|
208
|
+
setting.isMq.push(`(orientation: portrait)`)
|
|
209
|
+
} else if(/^landscape$/.test(kv[1])) {
|
|
210
|
+
setting.isMq.push(`(orientation: landscape)`)
|
|
211
|
+
}
|
|
212
|
+
break;
|
|
213
|
+
case 'width':
|
|
214
|
+
if(/^[\d\.a-zA-Z]+$/.test(kv[1])) {
|
|
215
|
+
let match = kv[1].match(/^([\d\.a-zA-Z]+)$/)
|
|
216
|
+
if(!!match[1]) {
|
|
217
|
+
setting.isMq.push(`(width: ${match[1]})`)
|
|
218
|
+
}
|
|
219
|
+
} else if(/^\-[\d\.a-zA-Z]+$/.test(kv[1])) {
|
|
220
|
+
let match = kv[1].match(/^\-([\d\.a-zA-Z]+)$/)
|
|
221
|
+
if(!!match[1]) {
|
|
222
|
+
setting.isMq.push(`(max-width: ${match[1]})`)
|
|
223
|
+
}
|
|
224
|
+
} else if(/^[\d\.a-zA-Z]+\-$/.test(kv[1])) {
|
|
225
|
+
let match = kv[1].match(/^([\d\.a-zA-Z]+)\-$/)
|
|
226
|
+
if(!!match[1]) {
|
|
227
|
+
setting.isMq.push(`(min-width: ${match[1]})`)
|
|
228
|
+
}
|
|
229
|
+
} else if(/^[\d\.a-zA-Z]+\-[\d\.a-zA-Z]+$/.test(kv[1])) {
|
|
230
|
+
let match = kv[1].match(/^([\d\.a-zA-Z]+)\-([\d\.a-zA-Z]+)$/)
|
|
231
|
+
if(!!match[1] && !!match[2]) {
|
|
232
|
+
setting.isMq.push(`(min-width: ${match[1]}) and (max-width: ${match[2]})`)
|
|
233
|
+
}
|
|
234
|
+
}
|
|
235
|
+
break;
|
|
236
|
+
default:
|
|
237
|
+
break;
|
|
238
|
+
}
|
|
239
|
+
}
|
|
240
|
+
})
|
|
241
|
+
setting.isMq = setting.isMq.join(' and ')
|
|
242
|
+
param[i] = param[i].replace(/mq\(.+?\)!/g, '')
|
|
243
|
+
}
|
|
125
244
|
|
|
126
|
-
|
|
127
|
-
.
|
|
128
|
-
.
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
245
|
+
if(/data\(.+?\)!/.test(param[i])) {
|
|
246
|
+
setting.isData = []
|
|
247
|
+
;(!!param[i].match(/data\((.+?)\)!/)[1] ? param[i].match(/data\((.+?)\)!/)[1] : '').split(',').forEach(q => {
|
|
248
|
+
let v1 = q.match(/^([A-Za-z\d_](?:[A-Za-z\d_\-]?[A-Za-z\d_])?)([\~\|\^\$\*]?=)['"](.*)['"]$/)
|
|
249
|
+
if(!!v1) {
|
|
250
|
+
setting.isData.push(`[data-${v1[1]}${v1[2]}"${v1[3].replace('\%','%25').replace('\"','%22').replace('\'','%27').replace('\`','%60').replace('\\','%5D')}"]`)
|
|
251
|
+
} else {
|
|
252
|
+
let v2 = q.match(/^([A-Za-z\d_](?:[A-Za-z\d_\-]?[A-Za-z\d_])?)$/)
|
|
253
|
+
if(!!v2) {
|
|
254
|
+
setting.isData.push(`[data-${v2[1]}]`)
|
|
255
|
+
}
|
|
256
|
+
}
|
|
257
|
+
})
|
|
258
|
+
setting.isData = setting.isData.join('')
|
|
259
|
+
param[i] = param[i].replace(/data\(.+?\)!/g, '')
|
|
260
|
+
}
|
|
261
|
+
|
|
262
|
+
if(/aria\(.+?\)!/.test(param[i])) {
|
|
263
|
+
setting.isAria = []
|
|
264
|
+
;(!!param[i].match(/aria\((.+?)\)!/)[1] ? param[i].match(/aria\((.+?)\)!/)[1] : '').split(',').forEach(q => {
|
|
265
|
+
let v = q.match(/^([a-z]+)=['"](.*)['"]$/)
|
|
266
|
+
if(!!v) {
|
|
267
|
+
setting.isAria.push(`[aria-${v[1]}="${v[2].replace('\%','%25').replace('\"','%22').replace('\'','%27').replace('\`','%60').replace('\\','%5D')}"]`)
|
|
268
|
+
}
|
|
269
|
+
})
|
|
270
|
+
setting.isAria = setting.isAria.join('')
|
|
271
|
+
param[i] = param[i].replace(/aria\(.+?\)!/g, '')
|
|
272
|
+
}
|
|
273
|
+
|
|
274
|
+
if(setting.isHover || setting.isDark || (setting.isMq !== '') || (setting.isData !== '') || (setting.isAria !== '')) {
|
|
275
|
+
let regex = param[i].match(/^([\d\-a-z]+):([^!\s]+)(!)?$/)
|
|
276
|
+
setting.important = (!!regex[3]) ? ' !important' : ''
|
|
277
|
+
setting.prop = expandShortcut(regex[1])
|
|
278
|
+
setting.value = replaceCssPropertyValueWBracket(regex[2])
|
|
279
|
+
|
|
280
|
+
for(let j = 0, m = setting.prop.length; j < m; j ++) {
|
|
281
|
+
const css = `${setting.isMq !== '' ? '@media screen and ' + setting.isMq + ' { ' : ''}${setting.isDark ? ':root.dark ' : ''}${rule.selector}${setting.isData}${setting.isAria}${setting.isHover ? ':hover' : ''}{${setting.prop[j]}: ${setting.value}}${setting.isMq !== '' ? ' }' : ''}`
|
|
282
|
+
rule.after(css)
|
|
283
|
+
}
|
|
284
|
+
} else if(/^([\d\-a-z]+):([^!\s]+)(!)?$/.test(param[i])) {
|
|
285
|
+
let regex = param[i].match(/^([\d\-a-z]+):([^!\s]+)(!)?$/)
|
|
286
|
+
setting.important = (!!regex[3]) ? ' !important' : ''
|
|
287
|
+
setting.value = replaceCssPropertyValueWBracket(regex[2])
|
|
132
288
|
|
|
133
289
|
for(let prop = expandShortcut(regex[1]), j = 0, m = prop.length; j < m; j ++) {
|
|
134
|
-
node.after(`${prop[j]}: ${value}${important};`)
|
|
290
|
+
node.after(`${prop[j]}: ${setting.value}${setting.important};`)
|
|
135
291
|
}
|
|
136
292
|
}
|
|
137
293
|
}
|
|
@@ -155,7 +311,7 @@ export const enumSpreader = (options = {}) => {
|
|
|
155
311
|
let colorText = []
|
|
156
312
|
for(let i = 0, l = defaultColorNames.length; i < l; i ++) {
|
|
157
313
|
for(let j = 0, m = scheme[defaultColorNames[i]].length; j < m; j ++) {
|
|
158
|
-
colorText.push(`--
|
|
314
|
+
colorText.push(`--color-${defaultColorNames[i]}-${scheme[defaultColorNames[i]][j][0]}: ${scheme[defaultColorNames[i]][j][1]};`)
|
|
159
315
|
}
|
|
160
316
|
}
|
|
161
317
|
root.prepend(postcss.parse(`:root { ${colorText.join('')} }`))
|
|
@@ -165,6 +321,12 @@ export const enumSpreader = (options = {}) => {
|
|
|
165
321
|
}
|
|
166
322
|
|
|
167
323
|
|
|
324
|
+
const replaceCssPropertyValueWBracket = value => value.replace(/\^/g, ' ')
|
|
325
|
+
.replace(/\[\[([^}]+)\]\]/g,(_,expr)=>`[[${expr.replace(/([+\*/]|(?<=[0-9a-zA-Z\)])[-%](?=[0-9a-zA-Z\(]))/g,' $1 ')}]]`)
|
|
326
|
+
.replace('[[', '(')
|
|
327
|
+
.replace(']]', ')')
|
|
328
|
+
.replace(/ +/g, ' ')
|
|
329
|
+
|
|
168
330
|
/**
|
|
169
331
|
* Expand shortcut property name.
|
|
170
332
|
* @param {String} prop - Specified property name.
|
package/package.json
CHANGED
|
@@ -35,15 +35,12 @@
|
|
|
35
35
|
|
|
36
36
|
&--item {
|
|
37
37
|
&::before {
|
|
38
|
-
@enums display:inline content:"\0bb\020" ct:var(--
|
|
38
|
+
@enums display:inline content:"\0bb\020" ct:var(--color-base-600);
|
|
39
39
|
}
|
|
40
40
|
|
|
41
41
|
&--anchor {
|
|
42
|
-
@enums text-decoration:var(--
|
|
43
|
-
|
|
44
|
-
&:hover {
|
|
45
|
-
@enums ct:var(--enums-color-pink-500) text-decoration-color:#fff0;
|
|
46
|
-
}
|
|
42
|
+
@enums text-decoration:var(--color-magenta-300)^underline^dotted^2px text-underline-offset:4px transition:text-decoration-color^0.25s^ease,color^0.25s^ease
|
|
43
|
+
hover!ct:var(--color-magenta-500) hover!text-decoration-color:#fff0;
|
|
47
44
|
}
|
|
48
45
|
}
|
|
49
46
|
}
|
|
@@ -66,22 +63,16 @@
|
|
|
66
63
|
@enums display:grid grid-template-columns:repeat(auto-fit,minmax(260px,1fr)) gap:1rem^1.5rem m8:0.375rem;
|
|
67
64
|
|
|
68
65
|
&--item {
|
|
69
|
-
@enums display:grid gap:0.5rem px:1rem py:0.5rem bw:1px bc:var(--
|
|
70
|
-
|
|
71
|
-
&:hover {
|
|
72
|
-
@enums transform:translateY(-0.25rem) box-shadow:0^0.5rem^1rem^#0004 bc:var(--enums-color-pink-800);
|
|
73
|
-
}
|
|
66
|
+
@enums display:grid gap:0.5rem px:1rem py:0.5rem bw:1px bc:var(--color-base-400) br:0.75rem transition:transform^0.25s^ease,box-shadow^0.25s^ease,border-color^0.25s^ease,background-color^0.25s^ease
|
|
67
|
+
hover!transform:translateY(-0.25rem) hover!box-shadow:0^0.5rem^1rem^#0004 hover!bc:var(--color-magenta-300) hover!cb:var(--color-magenta-50);
|
|
74
68
|
|
|
75
69
|
&--description {
|
|
76
70
|
@enums fs:0.95em;
|
|
77
71
|
}
|
|
78
72
|
|
|
79
73
|
&--anchor {
|
|
80
|
-
@enums text-decoration:var(--
|
|
81
|
-
|
|
82
|
-
&:hover {
|
|
83
|
-
@enums ct:var(--enums-color-pink-500) text-decoration-color:#fff0;
|
|
84
|
-
}
|
|
74
|
+
@enums text-decoration:var(--color-magenta-300)^underline^dotted^2px text-underline-offset:4px transition:text-decoration-color^0.25s^ease,color^0.25s^ease
|
|
75
|
+
hover!ct:var(--color-magenta-500) hover!text-decoration-color:#fff0;
|
|
85
76
|
}
|
|
86
77
|
}
|
|
87
78
|
}
|
|
@@ -93,15 +84,12 @@
|
|
|
93
84
|
@enums display:grid gap:1rem;
|
|
94
85
|
|
|
95
86
|
&--input {
|
|
96
|
-
@enums px:0.5rem py:0.375rem br:0.5rem cb:var(--
|
|
87
|
+
@enums px:0.5rem py:0.375rem br:0.5rem cb:var(--color-base-50) ct:var(--color-base-950) fs:1rem;
|
|
97
88
|
}
|
|
98
89
|
|
|
99
90
|
&--button {
|
|
100
|
-
@enums py:0.5rem br:0.5rem cb:var(--
|
|
101
|
-
|
|
102
|
-
&:hover {
|
|
103
|
-
@enums cb:#fff ct:var(--enums-color-pink-500);
|
|
104
|
-
}
|
|
91
|
+
@enums py:0.5rem br:0.5rem cb:var(--color-magenta-300) ct:var(--color-base-950) fs:1rem cursor:pointer transition:background-color^0.25s^ease,color^0.25s^ease
|
|
92
|
+
hover!cb:#fff hover!ct:var(--color-magenta-500);
|
|
105
93
|
}
|
|
106
94
|
}
|
|
107
95
|
}
|
|
@@ -35,15 +35,12 @@
|
|
|
35
35
|
|
|
36
36
|
&--item {
|
|
37
37
|
&::before {
|
|
38
|
-
@enums display:inline content:"\0bb\020" ct:var(--
|
|
38
|
+
@enums display:inline content:"\0bb\020" ct:var(--color-base-600);
|
|
39
39
|
}
|
|
40
40
|
|
|
41
41
|
&--anchor {
|
|
42
|
-
@enums text-decoration:var(--
|
|
43
|
-
|
|
44
|
-
&:hover {
|
|
45
|
-
@enums ct:var(--enums-color-pink-500) text-decoration-color:#fff0;
|
|
46
|
-
}
|
|
42
|
+
@enums text-decoration:var(--color-magenta-300)^underline^dotted^2px text-underline-offset:4px transition:text-decoration-color^0.25s^ease,color^0.25s^ease
|
|
43
|
+
hover!ct:var(--color-magenta-500) hover!text-decoration-color:#fff0;
|
|
47
44
|
}
|
|
48
45
|
}
|
|
49
46
|
}
|
|
@@ -66,22 +63,16 @@
|
|
|
66
63
|
@enums display:grid grid-template-columns:repeat(auto-fit,minmax(260px,1fr)) gap:1rem^1.5rem m8:0.375rem;
|
|
67
64
|
|
|
68
65
|
&--item {
|
|
69
|
-
@enums display:grid gap:0.5rem px:1rem py:0.5rem bw:1px bc:var(--
|
|
70
|
-
|
|
71
|
-
&:hover {
|
|
72
|
-
@enums transform:translateY(-0.25rem) box-shadow:0^0.5rem^1rem^#0004 bc:var(--enums-color-pink-800);
|
|
73
|
-
}
|
|
66
|
+
@enums display:grid gap:0.5rem px:1rem py:0.5rem bw:1px bc:var(--color-base-400) br:0.75rem transition:transform^0.25s^ease,box-shadow^0.25s^ease,border-color^0.25s^ease,background-color^0.25s^ease
|
|
67
|
+
hover!transform:translateY(-0.25rem) hover!box-shadow:0^0.5rem^1rem^#0004 hover!bc:var(--color-magenta-300) hover!cb:var(--color-magenta-50);
|
|
74
68
|
|
|
75
69
|
&--description {
|
|
76
70
|
@enums fs:0.95em;
|
|
77
71
|
}
|
|
78
72
|
|
|
79
73
|
&--anchor {
|
|
80
|
-
@enums text-decoration:var(--
|
|
81
|
-
|
|
82
|
-
&:hover {
|
|
83
|
-
@enums ct:var(--enums-color-pink-500) text-decoration-color:#fff0;
|
|
84
|
-
}
|
|
74
|
+
@enums text-decoration:var(--color-magenta-300)^underline^dotted^2px text-underline-offset:4px transition:text-decoration-color^0.25s^ease,color^0.25s^ease
|
|
75
|
+
hover!ct:var(--color-magenta-500) hover!text-decoration-color:#fff0;
|
|
85
76
|
}
|
|
86
77
|
}
|
|
87
78
|
}
|
|
@@ -93,15 +84,12 @@
|
|
|
93
84
|
@enums display:grid gap:1rem;
|
|
94
85
|
|
|
95
86
|
&--input {
|
|
96
|
-
@enums px:0.5rem py:0.375rem br:0.5rem cb:var(--
|
|
87
|
+
@enums px:0.5rem py:0.375rem br:0.5rem cb:var(--color-base-50) ct:var(--color-base-950) fs:1rem;
|
|
97
88
|
}
|
|
98
89
|
|
|
99
90
|
&--button {
|
|
100
|
-
@enums py:0.5rem br:0.5rem cb:var(--
|
|
101
|
-
|
|
102
|
-
&:hover {
|
|
103
|
-
@enums cb:#fff ct:var(--enums-color-pink-500);
|
|
104
|
-
}
|
|
91
|
+
@enums py:0.5rem br:0.5rem cb:var(--color-magenta-300) ct:var(--color-base-950) fs:1rem cursor:pointer transition:background-color^0.25s^ease,color^0.25s^ease
|
|
92
|
+
hover!cb:#fff hover!ct:var(--color-magenta-500);
|
|
105
93
|
}
|
|
106
94
|
}
|
|
107
95
|
}
|