postcss-enumerates-in-line 0.4.0 → 1.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.
- package/README.md +11 -5
- package/README_EN.md +11 -5
- package/package.json +1 -1
- package/test/gulp/gulpfile.mjs +6 -0
- package/test/gulp/package-lock.json +4 -4
- package/test/gulp/package.json +1 -1
- package/test/gulp/src/css/app.scss +15 -11
- package/test/postcss/build-css.mjs +6 -0
- package/test/postcss/package-lock.json +4 -4
- package/test/postcss/package.json +1 -1
- package/test/postcss/src/css/app.scss +15 -11
package/README.md
CHANGED
|
@@ -5,7 +5,12 @@
|
|
|
5
5
|
|[<img width="24" height="24" align="left" src="README.img/1f1ef-1f1f5.png" alt="🇯🇵"> 日本語](README.md)|[<img width="24" height="24" align="left" src="README.img/1f1fa-1f1f8.png" alt="🇺🇸"> English](README_EN.md)|
|
|
6
6
|
|
|
7
7
|
|
|
8
|
-
## 更新点:
|
|
8
|
+
## 更新点: v1.0.0
|
|
9
|
+
|
|
10
|
+
0. パッケージ全般
|
|
11
|
+
|
|
12
|
+
- サンプルプログラムの更新
|
|
13
|
+
- メジャーアップデート
|
|
9
14
|
|
|
10
15
|
1. 色設定
|
|
11
16
|
|
|
@@ -24,9 +29,6 @@
|
|
|
24
29
|
|
|
25
30
|
## 実装予定
|
|
26
31
|
|
|
27
|
-
- サンプルプログラムの更新
|
|
28
|
-
- メジャーアップデート
|
|
29
|
-
|
|
30
32
|
|
|
31
33
|
---
|
|
32
34
|
|
|
@@ -86,7 +88,7 @@
|
|
|
86
88
|
## 目次
|
|
87
89
|
|
|
88
90
|
- [PostCSS Enumerates in Line](#postcss-enumerates-in-line)
|
|
89
|
-
- [更新点:
|
|
91
|
+
- [更新点: v1.0.0](#更新点-v100)
|
|
90
92
|
- [実装予定](#実装予定)
|
|
91
93
|
- [目次](#目次)
|
|
92
94
|
- [CSSでの記述方法](#cssでの記述方法)
|
|
@@ -781,6 +783,8 @@ PostCSS処理の配列の中に、`enumSpreader({})`関数を差し込みます
|
|
|
781
783
|
|
|
782
784
|
この関数は初期設定のまま利用する場合は空のオブジェクトを指定します。
|
|
783
785
|
|
|
786
|
+
> サンプルプログラムではユーザー定義のショートハンドを追加する設定を行っています。
|
|
787
|
+
|
|
784
788
|
動作を変更したい場合は引数にオプション設定を加えます。
|
|
785
789
|
|
|
786
790
|
設定内容は[オプション引数](#オプション引数)を参照してください。
|
|
@@ -895,6 +899,8 @@ PostCSS処理の配列の中に、`enumSpreader({})`関数を差し込みます
|
|
|
895
899
|
|
|
896
900
|
この関数は初期設定のまま利用する場合は空のオブジェクトを指定します。
|
|
897
901
|
|
|
902
|
+
> サンプルプログラムではユーザー定義のショートハンドを追加する設定を行っています。
|
|
903
|
+
|
|
898
904
|
動作を変更したい場合は引数にオプション設定を加えます。
|
|
899
905
|
|
|
900
906
|
設定内容は[オプション引数](#オプション引数)を参照してください。
|
package/README_EN.md
CHANGED
|
@@ -5,7 +5,12 @@
|
|
|
5
5
|
|[<img width="24" height="24" align="left" src="README.img/1f1ef-1f1f5.png" alt="🇯🇵"> 日本語](README.md)|[<img width="24" height="24" align="left" src="README.img/1f1fa-1f1f8.png" alt="🇺🇸"> English](README_EN.md)|
|
|
6
6
|
|
|
7
7
|
|
|
8
|
-
## Revision: in
|
|
8
|
+
## Revision: in v1.0.0
|
|
9
|
+
|
|
10
|
+
0. About package
|
|
11
|
+
|
|
12
|
+
- Update sample programs.
|
|
13
|
+
- Upgrade major version to v1.
|
|
9
14
|
|
|
10
15
|
1. Color settings
|
|
11
16
|
|
|
@@ -25,9 +30,6 @@
|
|
|
25
30
|
|
|
26
31
|
## Maybe add functions
|
|
27
32
|
|
|
28
|
-
- Update sample programs.
|
|
29
|
-
- Upgrade major version to v1.
|
|
30
|
-
|
|
31
33
|
|
|
32
34
|
---
|
|
33
35
|
|
|
@@ -86,7 +88,7 @@ I think primary usage is [gulp] and [gulp-postcss]. However it also works on JS-
|
|
|
86
88
|
## Indexes
|
|
87
89
|
|
|
88
90
|
- [PostCSS Enumerates in Line](#postcss-enumerates-in-line)
|
|
89
|
-
- [Revision: in
|
|
91
|
+
- [Revision: in v1.0.0](#revision-in-v100)
|
|
90
92
|
- [Maybe add functions](#maybe-add-functions)
|
|
91
93
|
- [Indexes](#indexes)
|
|
92
94
|
- [Method of writing in CSS files.](#method-of-writing-in-css-files)
|
|
@@ -781,6 +783,8 @@ You will designate a blank object at a function of this package, if want to use
|
|
|
781
783
|
|
|
782
784
|
Or not want, might add option settings in the object.
|
|
783
785
|
|
|
786
|
+
> In sample program, there is a optional setting about appending user defined shorthands.
|
|
787
|
+
|
|
784
788
|
The detail of settings to know, refer to [Arguments of option settings](#arguments-of-option-settings).
|
|
785
789
|
|
|
786
790
|
|
|
@@ -894,6 +898,8 @@ You will designate a blank object at a function of this package, if want to use
|
|
|
894
898
|
|
|
895
899
|
Or not want, might add option settings in the object.
|
|
896
900
|
|
|
901
|
+
> In sample program, there is a optional setting about appending user defined shorthands.
|
|
902
|
+
|
|
897
903
|
The detail of settings to know, refer to [Arguments of option settings](#arguments-of-option-settings).
|
|
898
904
|
|
|
899
905
|
|
package/package.json
CHANGED
package/test/gulp/gulpfile.mjs
CHANGED
|
@@ -49,6 +49,12 @@ const task_css = done => {
|
|
|
49
49
|
enumSpreader({
|
|
50
50
|
//prependDefaultColor: 'rgb',
|
|
51
51
|
//prependDefaultStyle: false,
|
|
52
|
+
appendShorthand: [
|
|
53
|
+
['gtc', ['grid-template-columns']],
|
|
54
|
+
['fd', ['text-decoration']],
|
|
55
|
+
['fdc', ['text-decoration-color']],
|
|
56
|
+
['fdo', ['text-underline-offset']],
|
|
57
|
+
],
|
|
52
58
|
}),
|
|
53
59
|
autoprefixer(),
|
|
54
60
|
csso(),
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
"gulp-postcss": "^10.0.0",
|
|
17
17
|
"gulp-sass": "^6.0.1",
|
|
18
18
|
"postcss-csso": "^6.0.1",
|
|
19
|
-
"postcss-enumerates-in-line": "^0.0
|
|
19
|
+
"postcss-enumerates-in-line": "^0.4.0",
|
|
20
20
|
"sass": "^1.96.0"
|
|
21
21
|
}
|
|
22
22
|
},
|
|
@@ -2884,9 +2884,9 @@
|
|
|
2884
2884
|
}
|
|
2885
2885
|
},
|
|
2886
2886
|
"node_modules/postcss-enumerates-in-line": {
|
|
2887
|
-
"version": "0.0
|
|
2888
|
-
"resolved": "https://registry.npmjs.org/postcss-enumerates-in-line/-/postcss-enumerates-in-line-0.0.
|
|
2889
|
-
"integrity": "sha512-
|
|
2887
|
+
"version": "0.4.0",
|
|
2888
|
+
"resolved": "https://registry.npmjs.org/postcss-enumerates-in-line/-/postcss-enumerates-in-line-0.4.0.tgz",
|
|
2889
|
+
"integrity": "sha512-wyR1ocUyRkBIfsRxu1e7OZ+bBCGlx5RSSFoz94Iq0KviGpG9+ACCSIFiGS9AfMBdSo0YQQAC2QZdv7QzcCUZmw==",
|
|
2890
2890
|
"license": "ISC",
|
|
2891
2891
|
"dependencies": {
|
|
2892
2892
|
"postcss": "^8.5.6"
|
package/test/gulp/package.json
CHANGED
|
@@ -35,12 +35,13 @@
|
|
|
35
35
|
|
|
36
36
|
&--item {
|
|
37
37
|
&::before {
|
|
38
|
-
@enums display:inline content:"\0bb\020" ct:
|
|
38
|
+
@enums display:inline content:"\0bb\020" ct:color[[base,600]];
|
|
39
39
|
}
|
|
40
40
|
|
|
41
41
|
&--anchor {
|
|
42
|
-
@enums
|
|
43
|
-
|
|
42
|
+
@enums fd:color[[magenta,300]]^underline^dotted^2px fdo:4px
|
|
43
|
+
transition:text-decoration-color^0.25s^ease,color^0.25s^ease
|
|
44
|
+
hover!ct:color[[magenta,500]] hover!fdc:color[[white,999,0%]];
|
|
44
45
|
}
|
|
45
46
|
}
|
|
46
47
|
}
|
|
@@ -60,19 +61,21 @@
|
|
|
60
61
|
}
|
|
61
62
|
|
|
62
63
|
.c-projects {
|
|
63
|
-
@enums display:grid
|
|
64
|
+
@enums display:grid gtc:repeat(auto-fit,minmax(260px,1fr)) gap:1rem^1.5rem m8:0.375rem;
|
|
64
65
|
|
|
65
66
|
&--item {
|
|
66
|
-
@enums display:grid gap:0.5rem px:1rem py:0.5rem bw:1px bc:
|
|
67
|
-
|
|
67
|
+
@enums display:grid gap:0.5rem px:1rem py:0.5rem bw:1px bc:color[[base,400]] br:0.75rem
|
|
68
|
+
transition:transform^0.25s^ease,box-shadow^0.25s^ease,border-color^0.25s^ease,background-color^0.25s^ease
|
|
69
|
+
hover!transform:translateY(-0.25rem) hover!box-shadow:0^0.5rem^1rem^color[[black,999,25%]] hover!bc:color[[magenta,300]] hover!cb:color[[magenta,50]];
|
|
68
70
|
|
|
69
71
|
&--description {
|
|
70
72
|
@enums fs:0.95em;
|
|
71
73
|
}
|
|
72
74
|
|
|
73
75
|
&--anchor {
|
|
74
|
-
@enums
|
|
75
|
-
|
|
76
|
+
@enums fd:color[[magenta,300]]^underline^dotted^2px fdo:4px
|
|
77
|
+
transition:text-decoration-color^0.25s^ease,color^0.25s^ease
|
|
78
|
+
hover!ct:color[[magenta,500]] hover!fdc:color[[white,999,0%]];
|
|
76
79
|
}
|
|
77
80
|
}
|
|
78
81
|
}
|
|
@@ -84,12 +87,13 @@
|
|
|
84
87
|
@enums display:grid gap:1rem;
|
|
85
88
|
|
|
86
89
|
&--input {
|
|
87
|
-
@enums px:0.5rem py:0.375rem br:0.5rem cb:
|
|
90
|
+
@enums px:0.5rem py:0.375rem br:0.5rem cb:color[[base,50]] ct:color[[base,950]] fs:1rem;
|
|
88
91
|
}
|
|
89
92
|
|
|
90
93
|
&--button {
|
|
91
|
-
@enums py:0.5rem br:0.5rem cb:
|
|
92
|
-
|
|
94
|
+
@enums py:0.5rem br:0.5rem cb:color[[magenta,300]] ct:color[[base,950]] fs:1rem cursor:pointer
|
|
95
|
+
transition:background-color^0.25s^ease,color^0.25s^ease
|
|
96
|
+
hover!cb:color[[white,999]] hover!ct:color[[magenta,500]];
|
|
93
97
|
}
|
|
94
98
|
}
|
|
95
99
|
}
|
|
@@ -40,6 +40,12 @@ const task = async () => {
|
|
|
40
40
|
enumSpreader({
|
|
41
41
|
//prependDefaultColor: 'rgb',
|
|
42
42
|
//prependDefaultStyle: false,
|
|
43
|
+
appendShorthand: [
|
|
44
|
+
['gtc', ['grid-template-columns']],
|
|
45
|
+
['fd', ['text-decoration']],
|
|
46
|
+
['fdc', ['text-decoration-color']],
|
|
47
|
+
['fdo', ['text-underline-offset']],
|
|
48
|
+
],
|
|
43
49
|
}),
|
|
44
50
|
autoprefixer(),
|
|
45
51
|
csso(),
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
"npm-run-all2": "^8.0.4",
|
|
15
15
|
"postcss": "^8.5.6",
|
|
16
16
|
"postcss-csso": "^6.0.1",
|
|
17
|
-
"postcss-enumerates-in-line": "^0.0
|
|
17
|
+
"postcss-enumerates-in-line": "^0.4.0",
|
|
18
18
|
"sass": "^1.96.0"
|
|
19
19
|
}
|
|
20
20
|
},
|
|
@@ -903,9 +903,9 @@
|
|
|
903
903
|
}
|
|
904
904
|
},
|
|
905
905
|
"node_modules/postcss-enumerates-in-line": {
|
|
906
|
-
"version": "0.0
|
|
907
|
-
"resolved": "https://registry.npmjs.org/postcss-enumerates-in-line/-/postcss-enumerates-in-line-0.0.
|
|
908
|
-
"integrity": "sha512-
|
|
906
|
+
"version": "0.4.0",
|
|
907
|
+
"resolved": "https://registry.npmjs.org/postcss-enumerates-in-line/-/postcss-enumerates-in-line-0.4.0.tgz",
|
|
908
|
+
"integrity": "sha512-wyR1ocUyRkBIfsRxu1e7OZ+bBCGlx5RSSFoz94Iq0KviGpG9+ACCSIFiGS9AfMBdSo0YQQAC2QZdv7QzcCUZmw==",
|
|
909
909
|
"license": "ISC",
|
|
910
910
|
"dependencies": {
|
|
911
911
|
"postcss": "^8.5.6"
|
|
@@ -35,12 +35,13 @@
|
|
|
35
35
|
|
|
36
36
|
&--item {
|
|
37
37
|
&::before {
|
|
38
|
-
@enums display:inline content:"\0bb\020" ct:
|
|
38
|
+
@enums display:inline content:"\0bb\020" ct:color[[base,600]];
|
|
39
39
|
}
|
|
40
40
|
|
|
41
41
|
&--anchor {
|
|
42
|
-
@enums
|
|
43
|
-
|
|
42
|
+
@enums fd:color[[magenta,300]]^underline^dotted^2px fdo:4px
|
|
43
|
+
transition:text-decoration-color^0.25s^ease,color^0.25s^ease
|
|
44
|
+
hover!ct:color[[magenta,500]] hover!fdc:color[[white,999,0%]];
|
|
44
45
|
}
|
|
45
46
|
}
|
|
46
47
|
}
|
|
@@ -60,19 +61,21 @@
|
|
|
60
61
|
}
|
|
61
62
|
|
|
62
63
|
.c-projects {
|
|
63
|
-
@enums display:grid
|
|
64
|
+
@enums display:grid gtc:repeat(auto-fit,minmax(260px,1fr)) gap:1rem^1.5rem m8:0.375rem;
|
|
64
65
|
|
|
65
66
|
&--item {
|
|
66
|
-
@enums display:grid gap:0.5rem px:1rem py:0.5rem bw:1px bc:
|
|
67
|
-
|
|
67
|
+
@enums display:grid gap:0.5rem px:1rem py:0.5rem bw:1px bc:color[[base,400]] br:0.75rem
|
|
68
|
+
transition:transform^0.25s^ease,box-shadow^0.25s^ease,border-color^0.25s^ease,background-color^0.25s^ease
|
|
69
|
+
hover!transform:translateY(-0.25rem) hover!box-shadow:0^0.5rem^1rem^color[[black,999,25%]] hover!bc:color[[magenta,300]] hover!cb:color[[magenta,50]];
|
|
68
70
|
|
|
69
71
|
&--description {
|
|
70
72
|
@enums fs:0.95em;
|
|
71
73
|
}
|
|
72
74
|
|
|
73
75
|
&--anchor {
|
|
74
|
-
@enums
|
|
75
|
-
|
|
76
|
+
@enums fd:color[[magenta,300]]^underline^dotted^2px fdo:4px
|
|
77
|
+
transition:text-decoration-color^0.25s^ease,color^0.25s^ease
|
|
78
|
+
hover!ct:color[[magenta,500]] hover!fdc:color[[white,999,0%]];
|
|
76
79
|
}
|
|
77
80
|
}
|
|
78
81
|
}
|
|
@@ -84,12 +87,13 @@
|
|
|
84
87
|
@enums display:grid gap:1rem;
|
|
85
88
|
|
|
86
89
|
&--input {
|
|
87
|
-
@enums px:0.5rem py:0.375rem br:0.5rem cb:
|
|
90
|
+
@enums px:0.5rem py:0.375rem br:0.5rem cb:color[[base,50]] ct:color[[base,950]] fs:1rem;
|
|
88
91
|
}
|
|
89
92
|
|
|
90
93
|
&--button {
|
|
91
|
-
@enums py:0.5rem br:0.5rem cb:
|
|
92
|
-
|
|
94
|
+
@enums py:0.5rem br:0.5rem cb:color[[magenta,300]] ct:color[[base,950]] fs:1rem cursor:pointer
|
|
95
|
+
transition:background-color^0.25s^ease,color^0.25s^ease
|
|
96
|
+
hover!cb:color[[white,999]] hover!ct:color[[magenta,500]];
|
|
93
97
|
}
|
|
94
98
|
}
|
|
95
99
|
}
|