daisyui 4.3.0-alpha.7 → 4.3.0-alpha.8
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/dist/full.css +0 -1188
- package/package.json +5 -6
- package/src/index.js +34 -32
- package/src/lib/addPrefix.js +6 -6
- package/src/lib/responsiveRegex.js +1 -1
- package/src/lib/utility-classes.js +1 -1
- package/src/theming/colorNames.js +1 -1
- package/src/theming/functions.js +197 -185
- package/src/theming/index.js +1 -1
- package/src/theming/themeDefaults.js +46 -44
- package/src/theming/themes.js +1 -1
- package/src/docs/src/lib/data/themes.js +0 -34
- package/src/experiments/playground/src/components/Demo.astro +0 -160
- package/src/experiments/playground/src/env.d.ts +0 -1
- package/src/experiments/playground/src/layouts/Main.astro +0 -15
- package/src/experiments/playground/src/pages/LTR.astro +0 -8
- package/src/experiments/playground/src/pages/RTL.astro +0 -8
- package/src/experiments/playground/src/pages/dark.astro +0 -8
- package/src/experiments/playground/src/pages/demo.astro +0 -8
- package/src/experiments/playground/src/pages/index.astro +0 -32
- package/src/experiments/playground/src/pages/light.astro +0 -8
- package/themes.js +0 -2
- /package/dist/{base.cjs → base.js} +0 -0
- /package/dist/{styled.cjs → styled.js} +0 -0
- /package/dist/{unstyled.cjs → unstyled.js} +0 -0
- /package/dist/{utilities-styled.cjs → utilities-styled.js} +0 -0
- /package/dist/{utilities-unstyled.cjs → utilities-unstyled.js} +0 -0
- /package/dist/{utilities.cjs → utilities.js} +0 -0
|
@@ -1,45 +1,47 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
1
|
+
module.exports = {
|
|
2
|
+
themeOrder: [
|
|
3
|
+
"light",
|
|
4
|
+
"dark",
|
|
5
|
+
"cupcake",
|
|
6
|
+
"bumblebee",
|
|
7
|
+
"emerald",
|
|
8
|
+
"corporate",
|
|
9
|
+
"synthwave",
|
|
10
|
+
"retro",
|
|
11
|
+
"cyberpunk",
|
|
12
|
+
"valentine",
|
|
13
|
+
"halloween",
|
|
14
|
+
"garden",
|
|
15
|
+
"forest",
|
|
16
|
+
"aqua",
|
|
17
|
+
"lofi",
|
|
18
|
+
"pastel",
|
|
19
|
+
"fantasy",
|
|
20
|
+
"wireframe",
|
|
21
|
+
"black",
|
|
22
|
+
"luxury",
|
|
23
|
+
"dracula",
|
|
24
|
+
"cmyk",
|
|
25
|
+
"autumn",
|
|
26
|
+
"business",
|
|
27
|
+
"acid",
|
|
28
|
+
"lemonade",
|
|
29
|
+
"night",
|
|
30
|
+
"coffee",
|
|
31
|
+
"winter",
|
|
32
|
+
"dim",
|
|
33
|
+
"nord",
|
|
34
|
+
"sunset",
|
|
35
|
+
],
|
|
36
|
+
variables: {
|
|
37
|
+
"--rounded-box": "1rem",
|
|
38
|
+
"--rounded-btn": "0.5rem",
|
|
39
|
+
"--rounded-badge": "1.9rem",
|
|
40
|
+
"--animation-btn": "0.25s",
|
|
41
|
+
"--animation-input": ".2s",
|
|
42
|
+
"--btn-focus-scale": "0.95",
|
|
43
|
+
"--border-btn": "1px",
|
|
44
|
+
"--tab-border": "1px",
|
|
45
|
+
"--tab-radius": "0.5rem",
|
|
46
|
+
},
|
|
45
47
|
}
|
package/src/theming/themes.js
CHANGED
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
export const themes = [
|
|
2
|
-
"light",
|
|
3
|
-
"dark",
|
|
4
|
-
"cupcake",
|
|
5
|
-
"bumblebee",
|
|
6
|
-
"emerald",
|
|
7
|
-
"corporate",
|
|
8
|
-
"synthwave",
|
|
9
|
-
"retro",
|
|
10
|
-
"cyberpunk",
|
|
11
|
-
"valentine",
|
|
12
|
-
"halloween",
|
|
13
|
-
"garden",
|
|
14
|
-
"forest",
|
|
15
|
-
"aqua",
|
|
16
|
-
"lofi",
|
|
17
|
-
"pastel",
|
|
18
|
-
"fantasy",
|
|
19
|
-
"wireframe",
|
|
20
|
-
"black",
|
|
21
|
-
"luxury",
|
|
22
|
-
"dracula",
|
|
23
|
-
"cmyk",
|
|
24
|
-
"autumn",
|
|
25
|
-
"business",
|
|
26
|
-
"acid",
|
|
27
|
-
"lemonade",
|
|
28
|
-
"night",
|
|
29
|
-
"coffee",
|
|
30
|
-
"winter",
|
|
31
|
-
"dim",
|
|
32
|
-
"nord",
|
|
33
|
-
"sunset",
|
|
34
|
-
]
|
|
@@ -1,160 +0,0 @@
|
|
|
1
|
-
<div class="rounded-box bg-base-100 border-base-content/5 text-base-content not-prose grid gap-3 border p-6 max-w-2xl mx-auto my-6">
|
|
2
|
-
<div class="grid grid-cols-2 gap-2 md:grid-cols-4">
|
|
3
|
-
<button class="btn">Default</button>
|
|
4
|
-
<button class="btn btn-primary">Primary</button>
|
|
5
|
-
<button class="btn btn-secondary">Secondary</button>
|
|
6
|
-
<button class="btn btn-accent">Accent</button>
|
|
7
|
-
<button class="btn btn-info">Info</button>
|
|
8
|
-
<button class="btn btn-success">Success</button>
|
|
9
|
-
<button class="btn btn-warning">Warning</button>
|
|
10
|
-
<button class="btn btn-error">Error</button>
|
|
11
|
-
</div>
|
|
12
|
-
<div class="grid grid-cols-2 place-items-center gap-2 md:grid-cols-4">
|
|
13
|
-
<span class="badge">Default</span>
|
|
14
|
-
<span class="badge badge-primary">Primary</span>
|
|
15
|
-
<span class="badge badge-secondary">Secondary</span>
|
|
16
|
-
<span class="badge badge-accent">Accent</span>
|
|
17
|
-
<span class="badge badge-info">Info</span>
|
|
18
|
-
<span class="badge badge-success">Success</span>
|
|
19
|
-
<span class="badge badge-warning">Warning</span>
|
|
20
|
-
<span class="badge badge-error">Error</span>
|
|
21
|
-
</div>
|
|
22
|
-
<div class="flex flex-col gap-3">
|
|
23
|
-
<div class="flex flex-col gap-3 md:flex-row">
|
|
24
|
-
<div class="md:w-1/2">
|
|
25
|
-
<div class="tabs tabs-lifted">
|
|
26
|
-
<button class="tab ">Tab</button>
|
|
27
|
-
<button class="tab tab-active">Tab</button>
|
|
28
|
-
<button class="tab">Tab</button>
|
|
29
|
-
</div>
|
|
30
|
-
<div class="flex flex-col">
|
|
31
|
-
<span class="link">I'm a simple link</span>
|
|
32
|
-
<span class="link link-primary">I'm a simple link</span>
|
|
33
|
-
<span class="link link-secondary">I'm a simple link</span>
|
|
34
|
-
<span class="link link-accent">I'm a simple link</span>
|
|
35
|
-
</div>
|
|
36
|
-
</div>
|
|
37
|
-
<div class="flex flex-col gap-3 md:w-1/2">
|
|
38
|
-
<progress value="20" max="100" class="progress">Default</progress>
|
|
39
|
-
<progress value="25" max="100" class="progress progress-primary">Primary</progress>
|
|
40
|
-
<progress value="30" max="100" class="progress progress-secondary">Secondary</progress>
|
|
41
|
-
<progress value="40" max="100" class="progress progress-accent">Accent</progress>
|
|
42
|
-
<progress value="45" max="100" class="progress progress-info">Info</progress>
|
|
43
|
-
<progress value="55" max="100" class="progress progress-success">Success</progress>
|
|
44
|
-
<progress value="70" max="100" class="progress progress-warning">Warning</progress>
|
|
45
|
-
<progress value="90" max="100" class="progress progress-error">Error</progress>
|
|
46
|
-
</div>
|
|
47
|
-
</div>
|
|
48
|
-
<div class="flex flex-col gap-3 md:flex-row">
|
|
49
|
-
<div class="stats bg-base-300 border-base-300 border md:w-1/2">
|
|
50
|
-
<div class="stat">
|
|
51
|
-
<div class="stat-title">Total Page Views</div>
|
|
52
|
-
<div class="stat-value">89,400</div>
|
|
53
|
-
<div class="stat-desc">21% more than last month</div>
|
|
54
|
-
</div>
|
|
55
|
-
</div>
|
|
56
|
-
<div class="flex flex-wrap items-center justify-center gap-3 md:w-1/2">
|
|
57
|
-
<div class="radial-progress" style="--value:60; --size:3.5rem;">60%</div>
|
|
58
|
-
<div class="radial-progress" style="--value:75; --size:3.5rem;">75%</div>
|
|
59
|
-
<div class="radial-progress" style="--value:90; --size:3.5rem;">90%</div>
|
|
60
|
-
</div>
|
|
61
|
-
</div>
|
|
62
|
-
</div>
|
|
63
|
-
<div class="flex flex-col gap-3">
|
|
64
|
-
<div class="flex flex-col gap-3 md:flex-row">
|
|
65
|
-
<div class="md:w-1/2">
|
|
66
|
-
<div>
|
|
67
|
-
<input type="checkbox" class="toggle" />
|
|
68
|
-
<input type="checkbox" class="toggle toggle-primary" />
|
|
69
|
-
<input type="checkbox" class="toggle toggle-secondary" />
|
|
70
|
-
<input type="checkbox" class="toggle toggle-accent" />
|
|
71
|
-
</div>
|
|
72
|
-
<div>
|
|
73
|
-
<input type="checkbox" class="checkbox" />
|
|
74
|
-
<input type="checkbox" class="checkbox checkbox-primary" />
|
|
75
|
-
<input type="checkbox" class="checkbox checkbox-secondary" />
|
|
76
|
-
<input type="checkbox" class="checkbox checkbox-accent" />
|
|
77
|
-
</div>
|
|
78
|
-
<div>
|
|
79
|
-
<input type="radio" name="radio-1" class="radio" />
|
|
80
|
-
<input type="radio" name="radio-1" class="radio radio-primary" />
|
|
81
|
-
<input type="radio" name="radio-1" class="radio radio-secondary" />
|
|
82
|
-
<input type="radio" name="radio-1" class="radio radio-accent" />
|
|
83
|
-
</div>
|
|
84
|
-
</div>
|
|
85
|
-
<div class="md:w-1/2">
|
|
86
|
-
<input type="range" min="0" max="100" class="range range-xs" />
|
|
87
|
-
<input type="range" min="0" max="100" class="range range-xs range-primary" />
|
|
88
|
-
<input type="range" min="0" max="100" class="range range-xs range-secondary" />
|
|
89
|
-
<input type="range" min="0" max="100" class="range range-xs range-accent" />
|
|
90
|
-
</div>
|
|
91
|
-
</div>
|
|
92
|
-
<div class="flex flex-col gap-3 md:flex-row">
|
|
93
|
-
<div class="flex flex-col gap-3 md:w-1/2">
|
|
94
|
-
<input type="text" placeholder="Default" class="input input-bordered w-full" />
|
|
95
|
-
<input type="text" placeholder="Primary" class="input input-primary input-bordered w-full" />
|
|
96
|
-
<input type="text" placeholder="Secondary" class="input input-secondary input-bordered w-full" />
|
|
97
|
-
<input type="text" placeholder="Accent" class="input input-accent input-bordered w-full" />
|
|
98
|
-
</div>
|
|
99
|
-
<div class="flex flex-col gap-3 md:w-1/2">
|
|
100
|
-
<input type="text" placeholder="Info" class="input input-info input-bordered w-full" />
|
|
101
|
-
<input type="text" placeholder="Success" class="input input-success input-bordered w-full" />
|
|
102
|
-
<input type="text" placeholder="Warning" class="input input-warning input-bordered w-full" />
|
|
103
|
-
<input type="text" placeholder="Error" class="input input-error input-bordered w-full" />
|
|
104
|
-
</div>
|
|
105
|
-
</div>
|
|
106
|
-
<div class="navbar bg-neutral text-neutral-content rounded-box">
|
|
107
|
-
<div class="flex-none"><button class="btn btn-square btn-ghost"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block h-5 w-5 stroke-current"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path></svg></button></div>
|
|
108
|
-
<div class="flex-1"><button class="btn btn-ghost text-xl normal-case">daisyUI</button></div>
|
|
109
|
-
</div>
|
|
110
|
-
<div class="flex gap-3">
|
|
111
|
-
<div class="flex flex-grow flex-col gap-3">
|
|
112
|
-
<div class="text-4xl font-bold">Text Size 1</div>
|
|
113
|
-
<div class="text-3xl font-bold">Text Size 2</div>
|
|
114
|
-
<div class="text-2xl font-bold">Text Size 3</div>
|
|
115
|
-
<div class="text-xl font-bold">Text Size 4</div>
|
|
116
|
-
<div class="text-lg font-bold">Text Size 5</div>
|
|
117
|
-
<div class="text-sm font-bold">Text Size 6</div>
|
|
118
|
-
<div class="text-xs font-bold">Text Size 7</div>
|
|
119
|
-
</div>
|
|
120
|
-
<ul class="steps steps-vertical">
|
|
121
|
-
<li class="step step-primary">Step 1</li>
|
|
122
|
-
<li class="step step-primary">Step 2</li>
|
|
123
|
-
<li class="step">Step 3</li>
|
|
124
|
-
<li class="step">Step 4</li>
|
|
125
|
-
</ul>
|
|
126
|
-
</div>
|
|
127
|
-
</div>
|
|
128
|
-
<div class="flex flex-col gap-3">
|
|
129
|
-
<div class="alert">
|
|
130
|
-
<div>
|
|
131
|
-
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="stroke-info h-6 w-6 flex-shrink-0"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
|
|
132
|
-
<span>12 unread messages. Tap to see.</span>
|
|
133
|
-
</div>
|
|
134
|
-
</div>
|
|
135
|
-
<div class="alert alert-info">
|
|
136
|
-
<div>
|
|
137
|
-
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="h-6 w-6 flex-shrink-0 stroke-current"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
|
|
138
|
-
<span>New software update available.</span>
|
|
139
|
-
</div>
|
|
140
|
-
</div>
|
|
141
|
-
<div class="alert alert-success">
|
|
142
|
-
<div>
|
|
143
|
-
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 flex-shrink-0 stroke-current" fill="none" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
|
|
144
|
-
<span>Your purchase has been confirmed!</span>
|
|
145
|
-
</div>
|
|
146
|
-
</div>
|
|
147
|
-
<div class="alert alert-warning">
|
|
148
|
-
<div>
|
|
149
|
-
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 flex-shrink-0 stroke-current" fill="none" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"></path></svg>
|
|
150
|
-
<span>Warning: Invalid email address!</span>
|
|
151
|
-
</div>
|
|
152
|
-
</div>
|
|
153
|
-
<div class="alert alert-error">
|
|
154
|
-
<div>
|
|
155
|
-
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 flex-shrink-0 stroke-current" fill="none" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
|
|
156
|
-
<span>Error! Task failed successfully.</span>
|
|
157
|
-
</div>
|
|
158
|
-
</div>
|
|
159
|
-
</div>
|
|
160
|
-
</div>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
/// <reference types="astro/client" />
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
import 'tailwindcss/tailwind.css'
|
|
3
|
-
const { dir } = Astro.props
|
|
4
|
-
const { theme } = Astro.props
|
|
5
|
-
|
|
6
|
-
---
|
|
7
|
-
<html lang="en" dir={dir} data-theme={theme}>
|
|
8
|
-
<head>
|
|
9
|
-
<meta charset="utf-8" />
|
|
10
|
-
<meta name="viewport" content="width=device-width" />
|
|
11
|
-
</head>
|
|
12
|
-
<body>
|
|
13
|
-
<slot />
|
|
14
|
-
</body>
|
|
15
|
-
</html>
|
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
import Main from "../layouts/Main.astro"
|
|
3
|
-
const pages = await Astro.glob("./*.astro")
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
<Main>
|
|
7
|
-
<div class="flex flex-col gap-10 min-h-screen justify-center items-center p-4">
|
|
8
|
-
<div class="w-full max-w-lg flex flex-col gap-4">
|
|
9
|
-
<h1 class="font-bold text-lg">Welcome to daisyUI playground</h1>
|
|
10
|
-
<div class="text-base-content/50 flex flex-col gap-4">
|
|
11
|
-
<p>This is a Astro project where you can test daisyUI components from the source style (not the NPM package)</p>
|
|
12
|
-
<p>
|
|
13
|
-
Start by editing this file:
|
|
14
|
-
<pre class="font-mono text-sm bg-base-200 px-1 rounded break-all whitespace-pre-wrap">/src/experiments/playground/src/components/Component.astro</pre>
|
|
15
|
-
</p>
|
|
16
|
-
<p>You can see the result and test the components in the following pages:</p>
|
|
17
|
-
</div>
|
|
18
|
-
</div>
|
|
19
|
-
<ul class="menu w-full max-w-lg border border-base-content/10 rounded-box">
|
|
20
|
-
<li class="menu-title">Pages</li>
|
|
21
|
-
{
|
|
22
|
-
pages.map((page) => (
|
|
23
|
-
<li>
|
|
24
|
-
<a class="font-mono" href={page.url}>
|
|
25
|
-
{page.url}
|
|
26
|
-
</a>
|
|
27
|
-
</li>
|
|
28
|
-
))
|
|
29
|
-
}
|
|
30
|
-
</ul>
|
|
31
|
-
</div>
|
|
32
|
-
</Main>
|
package/themes.js
DELETED
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|