@shuriken-ui/tailwind 0.0.1 → 0.0.2

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,285 @@
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 shurikenUIPreset = {
159
+ darkMode: "class",
160
+ content: [],
161
+ plugins: [typography, aspectRatio, shurikenUIComponents],
162
+ theme: {
163
+ fontFamily: {
164
+ sans: ["Roboto Flex", "sans-serif"],
165
+ heading: ["Inter", "sans-serif"],
166
+ alt: ["Karla", "sans-serif"],
167
+ mono: ["ui-monospace", "monospace"]
168
+ },
169
+ extend: {
170
+ colors: {
171
+ muted: colors.slate,
172
+ primary: colors.violet,
173
+ info: colors.sky,
174
+ success: colors.teal,
175
+ warning: colors.amber,
176
+ danger: colors.rose
177
+ },
178
+ screens: {
179
+ xs: { max: "639px" },
180
+ lg: "1025px",
181
+ ptablet: {
182
+ raw: "(min-width: 768px) and (max-width: 1024px) and (orientation: portrait)"
183
+ },
184
+ ltablet: {
185
+ raw: "(min-width: 768px) and (max-width: 1024px) and (orientation: landscape)"
186
+ }
187
+ },
188
+ typography: ({ theme }) => ({
189
+ primary: {
190
+ css: {
191
+ "--tw-prose-links": theme("colors.primary.600"),
192
+ "--tw-prose-quote-borders": theme("colors.primary.600"),
193
+ "--tw-prose-invert-links": theme("colors.primary.500"),
194
+ "--tw-prose-invert-quote-borders": theme("colors.primary.500")
195
+ }
196
+ },
197
+ muted: {
198
+ css: {
199
+ "--tw-prose-body": theme("colors.muted.700"),
200
+ "--tw-prose-headings": theme("colors.muted.800"),
201
+ "--tw-prose-lead": theme("colors.muted.600"),
202
+ "--tw-prose-bold": theme("colors.muted.800"),
203
+ "--tw-prose-counters": theme("colors.muted.500"),
204
+ "--tw-prose-bullets": theme("colors.muted.300"),
205
+ "--tw-prose-hr": theme("colors.muted.200"),
206
+ "--tw-prose-quotes": theme("colors.muted.500"),
207
+ "--tw-prose-captions": theme("colors.muted.500"),
208
+ "--tw-prose-code": theme("colors.muted.800"),
209
+ "--tw-prose-pre-code": theme("colors.muted.800"),
210
+ "--tw-prose-pre-bg": theme("colors.muted.100"),
211
+ "--tw-prose-th-borders": theme("colors.muted.300"),
212
+ "--tw-prose-td-borders": theme("colors.muted.200"),
213
+ "--tw-prose-invert-body": theme("colors.muted.400"),
214
+ "--tw-prose-invert-headings": theme("colors.muted.100"),
215
+ "--tw-prose-invert-lead": theme("colors.muted.300"),
216
+ "--tw-prose-invert-bold": theme("colors.muted.300"),
217
+ "--tw-prose-invert-counters": theme("colors.muted.400"),
218
+ "--tw-prose-invert-bullets": theme("colors.muted.400"),
219
+ "--tw-prose-invert-hr": theme("colors.muted.800"),
220
+ "--tw-prose-invert-quotes": theme("colors.muted.200"),
221
+ "--tw-prose-invert-captions": theme("colors.muted.400"),
222
+ "--tw-prose-invert-code": theme("colors.muted.200"),
223
+ "--tw-prose-invert-pre-code": theme("colors.muted.200"),
224
+ "--tw-prose-invert-pre-bg": theme("colors.muted.800"),
225
+ "--tw-prose-invert-th-borders": theme("colors.muted.600"),
226
+ "--tw-prose-invert-td-borders": theme("colors.muted.700")
227
+ }
228
+ },
229
+ css: {
230
+ h1: {
231
+ fontWeight: 700
232
+ },
233
+ h2: {
234
+ fontWeight: 700
235
+ },
236
+ h3: {
237
+ fontWeight: 500
238
+ },
239
+ h4: {
240
+ fontWeight: 500
241
+ },
242
+ li: {
243
+ fontSize: "1.15rem",
244
+ padding: "0.35rem 0"
245
+ },
246
+ em: {
247
+ fontSize: "1.1rem",
248
+ lineHeight: 1
249
+ },
250
+ blockquote: {
251
+ fontSize: "1.1rem",
252
+ lineHeight: 1.4,
253
+ fontWeight: 500,
254
+ padding: "1.75rem"
255
+ },
256
+ pre: {
257
+ fontFamily: theme("fontFamily.mono")
258
+ },
259
+ code: {
260
+ fontFamily: theme("fontFamily.mono"),
261
+ padding: "0.35rem",
262
+ fontWeight: 600,
263
+ fontSize: "0.95rem !important"
264
+ }
265
+ }
266
+ }),
267
+ keyframes: {
268
+ indeterminate: {
269
+ "0%": { "margin-left": "-10%" },
270
+ "100%": { "margin-left": "100%" }
271
+ },
272
+ placeload: {
273
+ "0%": { "background-position": "-468px 0" },
274
+ "100%": { "background-position": "468px 0" }
275
+ }
276
+ },
277
+ animation: {
278
+ indeterminate: "indeterminate 1s cubic-bezier(0.4, 0, 0.2, 1) infinite",
279
+ placeload: "placeload 1s linear infinite forwards"
280
+ }
281
+ }
282
+ }
283
+ };
284
+
285
+ 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.2",
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
- )
@@ -1,135 +0,0 @@
1
- import type { Config } from 'tailwindcss'
2
- import colors from 'tailwindcss/colors'
3
- import typography from '@tailwindcss/typography'
4
- import aspectRatio from '@tailwindcss/aspect-ratio'
5
- import shurikenUIComponents from '../plugins/components'
6
-
7
- export default {
8
- darkMode: 'class',
9
- content: [],
10
- plugins: [typography, aspectRatio, shurikenUIComponents],
11
- theme: {
12
- fontFamily: {
13
- sans: ['Roboto Flex', 'sans-serif'],
14
- heading: ['Inter', 'sans-serif'],
15
- alt: ['Karla', 'sans-serif'],
16
- mono: ['ui-monospace', 'monospace'],
17
- },
18
-
19
- extend: {
20
- colors: {
21
- muted: colors.slate,
22
- primary: colors.violet,
23
- info: colors.sky,
24
- success: colors.teal,
25
- warning: colors.amber,
26
- danger: colors.rose,
27
- },
28
- screens: {
29
- xs: { max: '639px' },
30
- lg: '1025px',
31
- ptablet: {
32
- raw: '(min-width: 768px) and (max-width: 1024px) and (orientation: portrait)',
33
- },
34
- ltablet: {
35
- raw: '(min-width: 768px) and (max-width: 1024px) and (orientation: landscape)',
36
- },
37
- },
38
- typography: ({ theme }: any) => ({
39
- primary: {
40
- css: {
41
- '--tw-prose-links': theme('colors.primary.600'),
42
- '--tw-prose-quote-borders': theme('colors.primary.600'),
43
-
44
- '--tw-prose-invert-links': theme('colors.primary.500'),
45
- '--tw-prose-invert-quote-borders': theme('colors.primary.500'),
46
- },
47
- },
48
- muted: {
49
- css: {
50
- '--tw-prose-body': theme('colors.muted.700'),
51
- '--tw-prose-headings': theme('colors.muted.800'),
52
- '--tw-prose-lead': theme('colors.muted.600'),
53
- '--tw-prose-bold': theme('colors.muted.800'),
54
- '--tw-prose-counters': theme('colors.muted.500'),
55
- '--tw-prose-bullets': theme('colors.muted.300'),
56
- '--tw-prose-hr': theme('colors.muted.200'),
57
- '--tw-prose-quotes': theme('colors.muted.500'),
58
- '--tw-prose-captions': theme('colors.muted.500'),
59
- '--tw-prose-code': theme('colors.muted.800'),
60
- '--tw-prose-pre-code': theme('colors.muted.800'),
61
- '--tw-prose-pre-bg': theme('colors.muted.100'),
62
- '--tw-prose-th-borders': theme('colors.muted.300'),
63
- '--tw-prose-td-borders': theme('colors.muted.200'),
64
-
65
- '--tw-prose-invert-body': theme('colors.muted.400'),
66
- '--tw-prose-invert-headings': theme('colors.muted.100'),
67
- '--tw-prose-invert-lead': theme('colors.muted.300'),
68
- '--tw-prose-invert-bold': theme('colors.muted.300'),
69
- '--tw-prose-invert-counters': theme('colors.muted.400'),
70
- '--tw-prose-invert-bullets': theme('colors.muted.400'),
71
- '--tw-prose-invert-hr': theme('colors.muted.800'),
72
- '--tw-prose-invert-quotes': theme('colors.muted.200'),
73
- '--tw-prose-invert-captions': theme('colors.muted.400'),
74
- '--tw-prose-invert-code': theme('colors.muted.200'),
75
- '--tw-prose-invert-pre-code': theme('colors.muted.200'),
76
- '--tw-prose-invert-pre-bg': theme('colors.muted.800'),
77
- '--tw-prose-invert-th-borders': theme('colors.muted.600'),
78
- '--tw-prose-invert-td-borders': theme('colors.muted.700'),
79
- },
80
- },
81
- css: {
82
- h1: {
83
- fontWeight: 700,
84
- },
85
- h2: {
86
- fontWeight: 700,
87
- },
88
- h3: {
89
- fontWeight: 500,
90
- },
91
- h4: {
92
- fontWeight: 500,
93
- },
94
- li: {
95
- fontSize: '1.15rem',
96
- padding: '0.35rem 0',
97
- },
98
- em: {
99
- fontSize: '1.1rem',
100
- lineHeight: 1,
101
- },
102
- blockquote: {
103
- fontSize: '1.1rem',
104
- lineHeight: 1.4,
105
- fontWeight: 500,
106
- padding: '1.75rem',
107
- },
108
- pre: {
109
- fontFamily: theme('fontFamily.mono'),
110
- },
111
- code: {
112
- fontFamily: theme('fontFamily.mono'),
113
- padding: '0.35rem',
114
- fontWeight: 600,
115
- fontSize: '0.95rem !important',
116
- },
117
- },
118
- }),
119
- keyframes: {
120
- indeterminate: {
121
- '0%': { 'margin-left': '-10%' },
122
- '100%': { 'margin-left': '100%' },
123
- },
124
- placeload: {
125
- '0%': { 'background-position': '-468px 0' },
126
- '100%': { 'background-position': '468px 0' },
127
- },
128
- },
129
- animation: {
130
- indeterminate: 'indeterminate 1s cubic-bezier(0.4, 0, 0.2, 1) infinite',
131
- placeload: 'placeload 1s linear infinite forwards',
132
- },
133
- },
134
- },
135
- } satisfies Config
@@ -1,7 +0,0 @@
1
- import type { Config } from 'tailwindcss'
2
- import shurikenUIPreset from './preset'
3
-
4
- export default {
5
- content: [],
6
- presets: [shurikenUIPreset],
7
- } satisfies Config