adminium 1.0.1-beta.3 → 1.0.1-beta.5
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 +16 -10
- package/dist/styles/adminium.css +3122 -0
- package/dist/styles/config.reui.css +108 -0
- package/dist/styles/global.css +23 -0
- package/package.json +6 -2
package/README.md
CHANGED
|
@@ -28,21 +28,27 @@ npm install react react-dom tailwindcss
|
|
|
28
28
|
|
|
29
29
|
## Quick Start
|
|
30
30
|
|
|
31
|
-
### 1. Import
|
|
31
|
+
### 1. Import styles (choose one approach)
|
|
32
32
|
|
|
33
|
-
|
|
33
|
+
If your app already uses Tailwind (recommended), import the library styles into
|
|
34
|
+
your global CSS so Tailwind can generate both your app utilities and the library
|
|
35
|
+
utilities:
|
|
34
36
|
|
|
35
|
-
```
|
|
36
|
-
|
|
37
|
-
import "
|
|
37
|
+
```css
|
|
38
|
+
@import "tailwindcss";
|
|
39
|
+
@import "adminium/styles/global.css";
|
|
38
40
|
```
|
|
39
41
|
|
|
40
|
-
|
|
42
|
+
If you do not use Tailwind in the host app, import the precompiled CSS instead
|
|
43
|
+
(your app won't have Tailwind utilities like `lg:flex`):
|
|
41
44
|
|
|
42
|
-
```
|
|
43
|
-
|
|
45
|
+
```tsx
|
|
46
|
+
import "adminium/styles/adminium.css";
|
|
44
47
|
```
|
|
45
48
|
|
|
49
|
+
If you need style isolation later, we can reintroduce a scoped build that
|
|
50
|
+
prefixes selectors with a wrapper class.
|
|
51
|
+
|
|
46
52
|
### 2. Use the components
|
|
47
53
|
|
|
48
54
|
```tsx
|
|
@@ -53,7 +59,7 @@ import {
|
|
|
53
59
|
CardTitle,
|
|
54
60
|
CardContent,
|
|
55
61
|
Badge,
|
|
56
|
-
} from "
|
|
62
|
+
} from "adminium";
|
|
57
63
|
|
|
58
64
|
function App() {
|
|
59
65
|
return (
|
|
@@ -62,7 +68,7 @@ function App() {
|
|
|
62
68
|
<CardTitle>Welcome</CardTitle>
|
|
63
69
|
</CardHeader>
|
|
64
70
|
<CardContent>
|
|
65
|
-
<p>Hello from
|
|
71
|
+
<p>Hello from Adminium UI!</p>
|
|
66
72
|
<Button variant="primary" size="md">
|
|
67
73
|
Get Started
|
|
68
74
|
</Button>
|