@salla.sa/twilight-tailwind-theme 1.0.138 → 1.5.7
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 +40 -0
- package/package.json +8 -4
- package/readme.md +0 -48
package/README.md
ADDED
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
## Usage
|
|
2
|
+
|
|
3
|
+
1. add the plugin to tailwaind plugins in `tailwind.config.js` file
|
|
4
|
+
```js
|
|
5
|
+
plugins: [
|
|
6
|
+
...
|
|
7
|
+
require('@salla.sa/twilight-tailwind-theme'),
|
|
8
|
+
....
|
|
9
|
+
]
|
|
10
|
+
```
|
|
11
|
+
|
|
12
|
+
### JIT Enabled
|
|
13
|
+
|
|
14
|
+
**Tailwind** added a [just-in-time compiler](https://v2.tailwindcss.com/docs/just-in-time-mode), which generates styles as the developer writes the theme rather than generating everything in advance at initial build time.
|
|
15
|
+
|
|
16
|
+
Since JIT mode generates your CSS on-demand by scanning your template files, it’s crucial that you configure the `content` option in your `tailwind.config.js` file with all of your template paths, otherwise your CSS will be empty
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
```js title="tailwind.config.js"
|
|
20
|
+
...
|
|
21
|
+
content: [
|
|
22
|
+
// theme views
|
|
23
|
+
"views/**/*.twig",
|
|
24
|
+
// list of classes which required by twilight web components
|
|
25
|
+
"node_modules/@salla.sa/twilight-tailwind-theme/safe-list-css.txt"
|
|
26
|
+
],
|
|
27
|
+
...
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
## Add A new compnoent
|
|
31
|
+
|
|
32
|
+
1. create a new folder with the name of compnenet
|
|
33
|
+
2. create a `utilities.json` file with list of class as json
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
## Publish
|
|
37
|
+
|
|
38
|
+
```
|
|
39
|
+
npm run publish
|
|
40
|
+
```
|
package/package.json
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@salla.sa/twilight-tailwind-theme",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.5.7",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"keywords": [
|
|
6
|
+
"twilight",
|
|
6
7
|
"Salla twilight",
|
|
7
8
|
"tailwind",
|
|
8
9
|
"tailwind-theme",
|
|
@@ -12,8 +13,9 @@
|
|
|
12
13
|
"description": "Tailwind theme for twilight (Salla Themes)",
|
|
13
14
|
"homepage": "https://salla.dev",
|
|
14
15
|
"scripts": {
|
|
15
|
-
"
|
|
16
|
-
"
|
|
16
|
+
"build": "node generator.js",
|
|
17
|
+
"watch": "run-when-changed --watch './../twilight-components/src/components/**/utilities.json' --exec 'npm run build' --verbose",
|
|
18
|
+
"push": "npm version patch && npm run build && npm publish --access private"
|
|
17
19
|
},
|
|
18
20
|
"files": [
|
|
19
21
|
"index.js",
|
|
@@ -23,6 +25,8 @@
|
|
|
23
25
|
],
|
|
24
26
|
"devDependencies": {
|
|
25
27
|
"lodash": "^4.17.21",
|
|
28
|
+
"run-when-changed": "^2.1.0",
|
|
26
29
|
"tailwindcss": "^2.2.19"
|
|
27
|
-
}
|
|
30
|
+
},
|
|
31
|
+
"gitHead": "45e0b743178aecafaafd0c40feb83f64081f2701"
|
|
28
32
|
}
|
package/readme.md
DELETED
|
@@ -1,48 +0,0 @@
|
|
|
1
|
-
## Usage
|
|
2
|
-
|
|
3
|
-
1. add the plugin to tailwaind plugins in `tailwind.config.js` file
|
|
4
|
-
```js
|
|
5
|
-
plugins: [
|
|
6
|
-
...
|
|
7
|
-
require('@salla.sa/twilight-tailwind-theme'),
|
|
8
|
-
....
|
|
9
|
-
]
|
|
10
|
-
```
|
|
11
|
-
2. (Optional) in case you are enabling the `purge` you should add the safe list css class to purge settings in `tailwind.config.js` file
|
|
12
|
-
|
|
13
|
-
### JIT Enabled
|
|
14
|
-
|
|
15
|
-
because of https://tailwindcss.com/docs/just-in-time-mode#limitations
|
|
16
|
-
|
|
17
|
-
```js
|
|
18
|
-
mode: 'jit',
|
|
19
|
-
purge : {
|
|
20
|
-
enabled: true,
|
|
21
|
-
content: ["views/**/*.twig", "node_modules/@salla.sa/twilight-tailwind-theme/safe-list-css.txt"]
|
|
22
|
-
}
|
|
23
|
-
```
|
|
24
|
-
|
|
25
|
-
### JIT Disabled
|
|
26
|
-
|
|
27
|
-
You can easly add `/^s-.*/` to safelist
|
|
28
|
-
```js
|
|
29
|
-
purge : {
|
|
30
|
-
enabled: true,
|
|
31
|
-
content: ["views/**/*.twig"],
|
|
32
|
-
options: {
|
|
33
|
-
safelist: [/^s-.*/]
|
|
34
|
-
}
|
|
35
|
-
},
|
|
36
|
-
```
|
|
37
|
-
|
|
38
|
-
## Add A new compnoent
|
|
39
|
-
|
|
40
|
-
1. create a new folder with the name of compnenet
|
|
41
|
-
2. create a `utilities.json` file with list of class as json
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
## Publish
|
|
45
|
-
|
|
46
|
-
```
|
|
47
|
-
npm run publish
|
|
48
|
-
```
|