@shuriken-ui/tailwind 0.0.1 → 0.0.3

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,311 @@
1
+ import colors from 'tailwindcss/colors';
2
+ import typography from '@tailwindcss/typography';
3
+ import aspectRatio from '@tailwindcss/aspect-ratio';
4
+ import plugin from 'tailwindcss/plugin';
5
+
6
+ const shurikenUIComponents = plugin.withOptions(
7
+ function(options = {}) {
8
+ return function({ addComponents }) {
9
+ addComponents({
10
+ ".placeload": {
11
+ position: "relative",
12
+ background: "linear-gradient( to right, rgb(0 0 0 / 7%) 8% ,rgb(0 0 0 / 15%) 18%, rgb(0 0 0 / 7%) 33%)",
13
+ backgroundSize: "1200px 104px"
14
+ },
15
+ ".dark .placeload": {
16
+ position: "relative",
17
+ background: "linear-gradient(to right, rgb(255 255 255 / 15%) 8%, rgb(255 255 255 / 24%) 18%, rgb(255 255 255 / 15%) 33%)",
18
+ backgroundSize: "1200px 104px"
19
+ }
20
+ });
21
+ addComponents({
22
+ ".nui-focus": {
23
+ "@apply outline-1 outline-dashed outline-offset-2": {},
24
+ "@apply outline-transparent": {},
25
+ "&:focus-within": {
26
+ "@apply outline-muted-300 dark:outline-muted-600": {},
27
+ "@apply outline-dashed ring-0": {}
28
+ },
29
+ "&:focus-visible": {
30
+ "@apply outline-2": {}
31
+ }
32
+ }
33
+ });
34
+ addComponents({
35
+ ".nui-mask": {
36
+ "mask-size": "contain",
37
+ "mask-repeat": "no-repeat",
38
+ "mask-position": "center"
39
+ },
40
+ ".nui-mask-hex": {
41
+ "mask-image": "url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjE4MiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNNjQuNzg2IDE4MS40Yy05LjE5NiAwLTIwLjA2My02LjY4Ny0yNS4wNzktMTQuMjFMMy43NjIgMTA1LjMzYy01LjAxNi04LjM2LTUuMDE2LTIwLjkgMC0yOS4yNTlsMzUuOTQ1LTYxLjg2QzQ0LjcyMyA1Ljg1MSA1NS41OSAwIDY0Ljc4NiAwaDcxLjA1NWM5LjE5NiAwIDIwLjA2MyA2LjY4OCAyNS4wNzkgMTQuMjExbDM1Ljk0NSA2MS44NmM0LjE4IDguMzYgNC4xOCAyMC44OTkgMCAyOS4yNThsLTM1Ljk0NSA2MS44NmMtNC4xOCA4LjM2LTE1Ljg4MyAxNC4yMTEtMjUuMDc5IDE0LjIxMUg2NC43ODZ6Ii8+PC9zdmc+')"
42
+ },
43
+ ".nui-mask-hexed": {
44
+ "mask-image": "url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgyIiBoZWlnaHQ9IjIwMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNLjMgNjUuNDg2YzAtOS4xOTYgNi42ODctMjAuMDYzIDE0LjIxMS0yNS4wNzhsNjEuODYtMzUuOTQ2YzguMzYtNS4wMTYgMjAuODk5LTUuMDE2IDI5LjI1OCAwbDYxLjg2IDM1Ljk0NmM4LjM2IDUuMDE1IDE0LjIxMSAxNS44ODIgMTQuMjExIDI1LjA3OHY3MS4wNTVjMCA5LjE5Ni02LjY4NyAyMC4wNjMtMTQuMjExIDI1LjA3OWwtNjEuODYgMzUuOTQ1Yy04LjM2IDQuMTgtMjAuODk5IDQuMTgtMjkuMjU4IDBsLTYxLjg2LTM1Ljk0NUM2LjE1MSAxNTcuNDQuMyAxNDUuNzM3LjMgMTM2LjU0VjY1LjQ4NnoiLz48L3N2Zz4=')"
45
+ },
46
+ ".nui-mask-deca": {
47
+ "mask-image": "url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkyIiBoZWlnaHQ9IjIwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOTYgMGw1OC43NzkgMTkuMDk4IDM2LjMyNyA1MHY2MS44MDRsLTM2LjMyNyA1MEw5NiAyMDBsLTU4Ljc3OS0xOS4wOTgtMzYuMzI3LTUwVjY5LjA5OGwzNi4zMjctNTB6IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=')"
48
+ },
49
+ ".nui-mask-blob": {
50
+ "mask-image": "url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTAwIDBDMjAgMCAwIDIwIDAgMTAwczIwIDEwMCAxMDAgMTAwIDEwMC0yMCAxMDAtMTAwUzE4MCAwIDEwMCAweiIvPjwvc3ZnPg==')"
51
+ },
52
+ ".nui-mask-diamond": {
53
+ "mask-image": "url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTAwIDBsMTAwIDEwMC0xMDAgMTAwTDAgMTAweiIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+')"
54
+ }
55
+ });
56
+ addComponents({
57
+ ".nui-text-white": {
58
+ "@apply text-white dark:text-black": {}
59
+ },
60
+ ".nui-text-50": {
61
+ "@apply text-muted-50 dark:text-muted-900": {}
62
+ },
63
+ ".nui-text-100": {
64
+ "@apply text-muted-100 dark:text-muted-900": {}
65
+ },
66
+ ".nui-text-200": {
67
+ "@apply text-muted-200 dark:text-muted-800": {}
68
+ },
69
+ ".nui-text-300": {
70
+ "@apply text-muted-300 dark:text-muted-700": {}
71
+ },
72
+ ".nui-text-400": {
73
+ "@apply text-muted-400 dark:text-muted-600": {}
74
+ },
75
+ ".nui-text-500": {
76
+ "@apply text-muted-500 dark:text-muted-500": {}
77
+ },
78
+ ".nui-text-600": {
79
+ "@apply text-muted-600 dark:text-muted-400": {}
80
+ },
81
+ ".nui-text-700": {
82
+ "@apply text-muted-700 dark:text-muted-300": {}
83
+ },
84
+ ".nui-text-800": {
85
+ "@apply text-muted-800 dark:text-muted-200": {}
86
+ },
87
+ ".nui-text-900": {
88
+ "@apply text-muted-900 dark:text-muted-100": {}
89
+ },
90
+ ".nui-text-black": {
91
+ "@apply text-black dark:text-white": {}
92
+ }
93
+ });
94
+ addComponents({
95
+ ".nui-bg-white": {
96
+ "@apply bg-white dark:bg-muted-900": {}
97
+ },
98
+ ".nui-bg-50": {
99
+ "@apply bg-muted-50 dark:bg-muted-900": {}
100
+ },
101
+ ".nui-bg-100": {
102
+ "@apply bg-muted-100 dark:bg-muted-900": {}
103
+ },
104
+ ".nui-bg-200": {
105
+ "@apply bg-muted-200 dark:bg-muted-800": {}
106
+ },
107
+ ".nui-bg-300": {
108
+ "@apply bg-muted-300 dark:bg-muted-700": {}
109
+ },
110
+ ".nui-bg-400": {
111
+ "@apply bg-muted-400 dark:bg-muted-600": {}
112
+ },
113
+ ".nui-bg-500": {
114
+ "@apply bg-muted-500 dark:bg-muted-500": {}
115
+ },
116
+ ".nui-bg-600": {
117
+ "@apply bg-muted-600 dark:bg-muted-400": {}
118
+ },
119
+ ".nui-bg-700": {
120
+ "@apply bg-muted-700 dark:bg-muted-300": {}
121
+ },
122
+ ".nui-bg-800": {
123
+ "@apply bg-muted-800 dark:bg-muted-200": {}
124
+ },
125
+ ".nui-bg-900": {
126
+ "@apply bg-muted-900 dark:bg-muted-100": {}
127
+ },
128
+ ".nui-bg-black": {
129
+ "@apply bg-muted-900 dark:bg-white": {}
130
+ }
131
+ });
132
+ addComponents({
133
+ ".nui-label": {
134
+ "@apply inline-block font-alt leading-none text-muted-400 dark:text-muted-400/80": {}
135
+ }
136
+ });
137
+ addComponents({
138
+ ".nui-dropdown-divider": {
139
+ "@apply my-2 block h-px w-full border-t border-muted-200 dark:border-muted-600": {}
140
+ }
141
+ });
142
+ addComponents({
143
+ ".nui-mark": {
144
+ "@apply bg-primary-100 text-primary-800 dark:bg-primary-800 dark:text-primary-200": {}
145
+ }
146
+ });
147
+ };
148
+ },
149
+ function(options) {
150
+ return {
151
+ theme: {
152
+ nui: {}
153
+ }
154
+ };
155
+ }
156
+ );
157
+
158
+ const sansSystemFont = [
159
+ "ui-sans-serif",
160
+ "system-ui",
161
+ "-apple-system",
162
+ "BlinkMacSystemFont",
163
+ '"Segoe UI"',
164
+ "Roboto",
165
+ '"Helvetica Neue"',
166
+ "Arial",
167
+ '"Noto Sans"',
168
+ "sans-serif",
169
+ '"Apple Color Emoji"',
170
+ '"Segoe UI Emoji"',
171
+ '"Segoe UI Symbol"',
172
+ '"Noto Color Emoji"'
173
+ ];
174
+ const monoSystemFont = [
175
+ "ui-monospace",
176
+ "SFMono-Regular",
177
+ "Menlo",
178
+ "Monaco",
179
+ "Consolas",
180
+ '"Liberation Mono"',
181
+ '"Courier New"',
182
+ "monospace"
183
+ ];
184
+ const shurikenUIPreset = {
185
+ darkMode: "class",
186
+ content: [],
187
+ plugins: [typography, aspectRatio, shurikenUIComponents],
188
+ theme: {
189
+ fontFamily: {
190
+ sans: sansSystemFont,
191
+ heading: sansSystemFont,
192
+ alt: sansSystemFont,
193
+ mono: monoSystemFont
194
+ },
195
+ extend: {
196
+ colors: {
197
+ muted: colors.slate,
198
+ primary: colors.violet,
199
+ info: colors.sky,
200
+ success: colors.teal,
201
+ warning: colors.amber,
202
+ danger: colors.rose
203
+ },
204
+ screens: {
205
+ xs: { max: "639px" },
206
+ lg: "1025px",
207
+ ptablet: {
208
+ raw: "(min-width: 768px) and (max-width: 1024px) and (orientation: portrait)"
209
+ },
210
+ ltablet: {
211
+ raw: "(min-width: 768px) and (max-width: 1024px) and (orientation: landscape)"
212
+ }
213
+ },
214
+ typography: ({ theme }) => ({
215
+ primary: {
216
+ css: {
217
+ "--tw-prose-links": theme("colors.primary.600"),
218
+ "--tw-prose-quote-borders": theme("colors.primary.600"),
219
+ "--tw-prose-invert-links": theme("colors.primary.500"),
220
+ "--tw-prose-invert-quote-borders": theme("colors.primary.500")
221
+ }
222
+ },
223
+ muted: {
224
+ css: {
225
+ "--tw-prose-body": theme("colors.muted.700"),
226
+ "--tw-prose-headings": theme("colors.muted.800"),
227
+ "--tw-prose-lead": theme("colors.muted.600"),
228
+ "--tw-prose-bold": theme("colors.muted.800"),
229
+ "--tw-prose-counters": theme("colors.muted.500"),
230
+ "--tw-prose-bullets": theme("colors.muted.300"),
231
+ "--tw-prose-hr": theme("colors.muted.200"),
232
+ "--tw-prose-quotes": theme("colors.muted.500"),
233
+ "--tw-prose-captions": theme("colors.muted.500"),
234
+ "--tw-prose-code": theme("colors.muted.800"),
235
+ "--tw-prose-pre-code": theme("colors.muted.800"),
236
+ "--tw-prose-pre-bg": theme("colors.muted.100"),
237
+ "--tw-prose-th-borders": theme("colors.muted.300"),
238
+ "--tw-prose-td-borders": theme("colors.muted.200"),
239
+ "--tw-prose-invert-body": theme("colors.muted.400"),
240
+ "--tw-prose-invert-headings": theme("colors.muted.100"),
241
+ "--tw-prose-invert-lead": theme("colors.muted.300"),
242
+ "--tw-prose-invert-bold": theme("colors.muted.300"),
243
+ "--tw-prose-invert-counters": theme("colors.muted.400"),
244
+ "--tw-prose-invert-bullets": theme("colors.muted.400"),
245
+ "--tw-prose-invert-hr": theme("colors.muted.800"),
246
+ "--tw-prose-invert-quotes": theme("colors.muted.200"),
247
+ "--tw-prose-invert-captions": theme("colors.muted.400"),
248
+ "--tw-prose-invert-code": theme("colors.muted.200"),
249
+ "--tw-prose-invert-pre-code": theme("colors.muted.200"),
250
+ "--tw-prose-invert-pre-bg": theme("colors.muted.800"),
251
+ "--tw-prose-invert-th-borders": theme("colors.muted.600"),
252
+ "--tw-prose-invert-td-borders": theme("colors.muted.700")
253
+ }
254
+ },
255
+ css: {
256
+ h1: {
257
+ fontWeight: 700
258
+ },
259
+ h2: {
260
+ fontWeight: 700
261
+ },
262
+ h3: {
263
+ fontWeight: 500
264
+ },
265
+ h4: {
266
+ fontWeight: 500
267
+ },
268
+ li: {
269
+ fontSize: "1.15rem",
270
+ padding: "0.35rem 0"
271
+ },
272
+ em: {
273
+ fontSize: "1.1rem",
274
+ lineHeight: 1
275
+ },
276
+ blockquote: {
277
+ fontSize: "1.1rem",
278
+ lineHeight: 1.4,
279
+ fontWeight: 500,
280
+ padding: "1.75rem"
281
+ },
282
+ pre: {
283
+ fontFamily: theme("fontFamily.mono")
284
+ },
285
+ code: {
286
+ fontFamily: theme("fontFamily.mono"),
287
+ padding: "0.35rem",
288
+ fontWeight: 600,
289
+ fontSize: "0.95rem !important"
290
+ }
291
+ }
292
+ }),
293
+ keyframes: {
294
+ indeterminate: {
295
+ "0%": { "margin-left": "-10%" },
296
+ "100%": { "margin-left": "100%" }
297
+ },
298
+ placeload: {
299
+ "0%": { "background-position": "-468px 0" },
300
+ "100%": { "background-position": "468px 0" }
301
+ }
302
+ },
303
+ animation: {
304
+ indeterminate: "indeterminate 1s cubic-bezier(0.4, 0, 0.2, 1) infinite",
305
+ placeload: "placeload 1s linear infinite forwards"
306
+ }
307
+ }
308
+ }
309
+ };
310
+
311
+ export { shurikenUIPreset as default };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@shuriken-ui/tailwind",
3
- "version": "0.0.1",
3
+ "version": "0.0.3",
4
4
  "license": "MIT",
5
5
  "author": "Css Ninja <hello@cssninja.io> (https://cssninja.io)",
6
6
  "repository": "shuriken-ui/tailwind",
@@ -19,16 +19,35 @@
19
19
  "module"
20
20
  ],
21
21
  "type": "module",
22
+ "main": "./dist/index.cjs",
23
+ "types": "./dist/index.d.ts",
22
24
  "exports": {
23
- ".": "./src/index.ts",
24
- "./preset": "./src/preset/index.ts",
25
- "./config": "./src/tailwind.config.ts",
26
- "./colors": "./src/colors.ts"
25
+ ".": {
26
+ "types": "./dist/index.d.ts",
27
+ "import": "./dist/index.mjs",
28
+ "require": "./dist/index.cjs"
29
+ },
30
+ "./preset": {
31
+ "types": "./dist/preset.d.ts",
32
+ "import": "./dist/preset.mjs",
33
+ "require": "./dist/preset.cjs"
34
+ },
35
+ "./config": {
36
+ "types": "./dist/config.d.ts",
37
+ "import": "./dist/config.mjs",
38
+ "require": "./dist/config.cjs"
39
+ },
40
+ "./colors": {
41
+ "types": "./dist/colors.d.ts",
42
+ "import": "./dist/colors.mjs",
43
+ "require": "./dist/colors.cjs"
44
+ }
27
45
  },
28
46
  "files": [
29
- "src"
47
+ "dist"
30
48
  ],
31
49
  "scripts": {
50
+ "build": "unbuild",
32
51
  "lint": "run-s lint:eslint:fix lint:prettier:fix",
33
52
  "lint:prettier": "prettier --check \"./**/*.(ts|vue|css|scss|md)\"",
34
53
  "lint:prettier:fix": "prettier --write \"./**/*.(ts|vue|css|scss|md)\"",
@@ -36,6 +55,7 @@
36
55
  "lint:eslint:fix": "eslint -c .eslintrc.cjs --fix --ext .vue,.ts .",
37
56
  "test": "run-p test:*",
38
57
  "test:lint": "run-s lint:eslint lint:prettier",
58
+ "prepack": "pnpm run build",
39
59
  "release": "run-s test release:*",
40
60
  "release:standard-version": "standard-version",
41
61
  "release:publish": "git push --follow-tags origin main && npm publish",
@@ -63,7 +83,8 @@
63
83
  "prettier": "^2.8.7",
64
84
  "simple-git-hooks": "^2.8.1",
65
85
  "standard-version": "^9.5.0",
66
- "typescript": "^5.0.2"
86
+ "typescript": "^5.0.2",
87
+ "unbuild": "^1.2.1"
67
88
  },
68
89
  "simple-git-hooks": {
69
90
  "pre-commit": "pnpm lint-staged",
package/src/colors.ts DELETED
@@ -1 +0,0 @@
1
- export {}
package/src/index.ts DELETED
@@ -1,7 +0,0 @@
1
- import type { Config } from 'tailwindcss'
2
- import { defu } from 'defu'
3
- import config from './tailwind.config'
4
-
5
- export function withShurikenUI(userConfig: Config) {
6
- return defu(userConfig, config)
7
- }
@@ -1,170 +0,0 @@
1
- import plugin from 'tailwindcss/plugin'
2
-
3
- export default plugin.withOptions(
4
- function (options = {}) {
5
- return function ({ addComponents }) {
6
- addComponents({
7
- '.placeload': {
8
- position: 'relative',
9
- background:
10
- 'linear-gradient( to right, rgb(0 0 0 / 7%) 8% ,rgb(0 0 0 / 15%) 18%, rgb(0 0 0 / 7%) 33%)',
11
- backgroundSize: '1200px 104px',
12
- },
13
- '.dark .placeload': {
14
- position: 'relative',
15
- background:
16
- 'linear-gradient(to right, rgb(255 255 255 / 15%) 8%, rgb(255 255 255 / 24%) 18%, rgb(255 255 255 / 15%) 33%)',
17
- backgroundSize: '1200px 104px',
18
- },
19
- })
20
-
21
- addComponents({
22
- '.nui-focus': {
23
- '@apply outline-1 outline-dashed outline-offset-2': {},
24
- '@apply outline-transparent': {},
25
- '&:focus-within': {
26
- '@apply outline-muted-300 dark:outline-muted-600': {},
27
- '@apply outline-dashed ring-0': {},
28
- },
29
- '&:focus-visible': {
30
- '@apply outline-2': {},
31
- },
32
- },
33
- })
34
-
35
- addComponents({
36
- '.nui-mask': {
37
- 'mask-size': 'contain',
38
- 'mask-repeat': 'no-repeat',
39
- 'mask-position': 'center',
40
- },
41
- '.nui-mask-hex': {
42
- 'mask-image':
43
- "url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjE4MiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNNjQuNzg2IDE4MS40Yy05LjE5NiAwLTIwLjA2My02LjY4Ny0yNS4wNzktMTQuMjFMMy43NjIgMTA1LjMzYy01LjAxNi04LjM2LTUuMDE2LTIwLjkgMC0yOS4yNTlsMzUuOTQ1LTYxLjg2QzQ0LjcyMyA1Ljg1MSA1NS41OSAwIDY0Ljc4NiAwaDcxLjA1NWM5LjE5NiAwIDIwLjA2MyA2LjY4OCAyNS4wNzkgMTQuMjExbDM1Ljk0NSA2MS44NmM0LjE4IDguMzYgNC4xOCAyMC44OTkgMCAyOS4yNThsLTM1Ljk0NSA2MS44NmMtNC4xOCA4LjM2LTE1Ljg4MyAxNC4yMTEtMjUuMDc5IDE0LjIxMUg2NC43ODZ6Ii8+PC9zdmc+')",
44
- },
45
- '.nui-mask-hexed': {
46
- 'mask-image':
47
- "url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgyIiBoZWlnaHQ9IjIwMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNLjMgNjUuNDg2YzAtOS4xOTYgNi42ODctMjAuMDYzIDE0LjIxMS0yNS4wNzhsNjEuODYtMzUuOTQ2YzguMzYtNS4wMTYgMjAuODk5LTUuMDE2IDI5LjI1OCAwbDYxLjg2IDM1Ljk0NmM4LjM2IDUuMDE1IDE0LjIxMSAxNS44ODIgMTQuMjExIDI1LjA3OHY3MS4wNTVjMCA5LjE5Ni02LjY4NyAyMC4wNjMtMTQuMjExIDI1LjA3OWwtNjEuODYgMzUuOTQ1Yy04LjM2IDQuMTgtMjAuODk5IDQuMTgtMjkuMjU4IDBsLTYxLjg2LTM1Ljk0NUM2LjE1MSAxNTcuNDQuMyAxNDUuNzM3LjMgMTM2LjU0VjY1LjQ4NnoiLz48L3N2Zz4=')",
48
- },
49
- '.nui-mask-deca': {
50
- 'mask-image':
51
- "url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTkyIiBoZWlnaHQ9IjIwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOTYgMGw1OC43NzkgMTkuMDk4IDM2LjMyNyA1MHY2MS44MDRsLTM2LjMyNyA1MEw5NiAyMDBsLTU4Ljc3OS0xOS4wOTgtMzYuMzI3LTUwVjY5LjA5OGwzNi4zMjctNTB6IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=')",
52
- },
53
- '.nui-mask-blob': {
54
- 'mask-image':
55
- "url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTAwIDBDMjAgMCAwIDIwIDAgMTAwczIwIDEwMCAxMDAgMTAwIDEwMC0yMCAxMDAtMTAwUzE4MCAwIDEwMCAweiIvPjwvc3ZnPg==')",
56
- },
57
- '.nui-mask-diamond': {
58
- 'mask-image':
59
- "url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTAwIDBsMTAwIDEwMC0xMDAgMTAwTDAgMTAweiIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9zdmc+')",
60
- },
61
- })
62
-
63
- addComponents({
64
- '.nui-text-white': {
65
- '@apply text-white dark:text-black': {},
66
- },
67
- '.nui-text-50': {
68
- '@apply text-muted-50 dark:text-muted-900': {},
69
- },
70
- '.nui-text-100': {
71
- '@apply text-muted-100 dark:text-muted-900': {},
72
- },
73
- '.nui-text-200': {
74
- '@apply text-muted-200 dark:text-muted-800': {},
75
- },
76
- '.nui-text-300': {
77
- '@apply text-muted-300 dark:text-muted-700': {},
78
- },
79
- '.nui-text-400': {
80
- '@apply text-muted-400 dark:text-muted-600': {},
81
- },
82
- '.nui-text-500': {
83
- '@apply text-muted-500 dark:text-muted-500': {},
84
- },
85
- '.nui-text-600': {
86
- '@apply text-muted-600 dark:text-muted-400': {},
87
- },
88
- '.nui-text-700': {
89
- '@apply text-muted-700 dark:text-muted-300': {},
90
- },
91
- '.nui-text-800': {
92
- '@apply text-muted-800 dark:text-muted-200': {},
93
- },
94
- '.nui-text-900': {
95
- '@apply text-muted-900 dark:text-muted-100': {},
96
- },
97
- '.nui-text-black': {
98
- '@apply text-black dark:text-white': {},
99
- },
100
- })
101
-
102
- addComponents({
103
- '.nui-bg-white': {
104
- '@apply bg-white dark:bg-muted-900': {},
105
- },
106
- '.nui-bg-50': {
107
- '@apply bg-muted-50 dark:bg-muted-900': {},
108
- },
109
- '.nui-bg-100': {
110
- '@apply bg-muted-100 dark:bg-muted-900': {},
111
- },
112
- '.nui-bg-200': {
113
- '@apply bg-muted-200 dark:bg-muted-800': {},
114
- },
115
- '.nui-bg-300': {
116
- '@apply bg-muted-300 dark:bg-muted-700': {},
117
- },
118
- '.nui-bg-400': {
119
- '@apply bg-muted-400 dark:bg-muted-600': {},
120
- },
121
- '.nui-bg-500': {
122
- '@apply bg-muted-500 dark:bg-muted-500': {},
123
- },
124
- '.nui-bg-600': {
125
- '@apply bg-muted-600 dark:bg-muted-400': {},
126
- },
127
- '.nui-bg-700': {
128
- '@apply bg-muted-700 dark:bg-muted-300': {},
129
- },
130
- '.nui-bg-800': {
131
- '@apply bg-muted-800 dark:bg-muted-200': {},
132
- },
133
- '.nui-bg-900': {
134
- '@apply bg-muted-900 dark:bg-muted-100': {},
135
- },
136
- '.nui-bg-black': {
137
- '@apply bg-muted-900 dark:bg-white': {},
138
- },
139
- })
140
-
141
- addComponents({
142
- '.nui-label': {
143
- '@apply inline-block font-alt leading-none text-muted-400 dark:text-muted-400/80':
144
- {},
145
- },
146
- })
147
-
148
- addComponents({
149
- '.nui-dropdown-divider': {
150
- '@apply my-2 block h-px w-full border-t border-muted-200 dark:border-muted-600':
151
- {},
152
- },
153
- })
154
-
155
- addComponents({
156
- '.nui-mark': {
157
- '@apply bg-primary-100 text-primary-800 dark:bg-primary-800 dark:text-primary-200':
158
- {},
159
- },
160
- })
161
- }
162
- },
163
- function (options) {
164
- return {
165
- theme: {
166
- nui: {},
167
- },
168
- }
169
- }
170
- )