fulldev-ui 0.4.10 → 0.4.11
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/package.json +3 -2
- package/pnpm-lock.yaml +3640 -2909
- package/public/images/og-image.png +0 -0
- package/src/blocks/Contact.astro +6 -4
- package/src/blocks/Intro.astro +5 -3
- package/src/blocks/Prices.astro +6 -4
- package/src/components/Avatar.astro +18 -16
- package/src/components/Badge.astro +33 -31
- package/src/components/Bento.astro +16 -14
- package/src/components/Button.astro +77 -75
- package/src/components/Card.astro +47 -45
- package/src/components/Carousel.astro +27 -25
- package/src/components/Checkbox.astro +12 -10
- package/src/components/Column.astro +35 -33
- package/src/components/Dialog.astro +19 -17
- package/src/components/Drawer.astro +39 -37
- package/src/components/Footer.astro +39 -37
- package/src/components/Grid.astro +9 -7
- package/src/components/Header.astro +58 -52
- package/src/components/Heading.astro +30 -28
- package/src/components/Icon.astro +15 -13
- package/src/components/Image.astro +93 -91
- package/src/components/Input.astro +51 -49
- package/src/components/Label.astro +11 -9
- package/src/components/Link.astro +34 -32
- package/src/components/List.astro +14 -12
- package/src/components/Masonry.astro +17 -15
- package/src/components/Rating.astro +15 -13
- package/src/components/Root.astro +8 -3
- package/src/components/Row.astro +17 -15
- package/src/components/Section.astro +62 -60
- package/src/components/Select.astro +59 -57
- package/src/components/Sidebar.astro +16 -13
- package/src/components/Split.astro +26 -24
- package/src/components/Spread.astro +18 -16
- package/src/components/Switch.astro +50 -48
- package/src/components/Table.astro +50 -48
- package/src/components/Tagline.astro +8 -6
- package/src/components/Text.astro +11 -9
- package/src/components/Textarea.astro +44 -42
- package/src/components/Toc.astro +16 -13
- package/src/components/Wrap.astro +16 -14
- package/src/components/experimental/Price.astro +11 -9
- package/src/components/experimental/Prose.astro +114 -112
- package/src/components/experimental/Window.astro +58 -56
- package/src/content/pages/index.mdx +1 -1
- package/src/content/pages/overview/frameworks.mdx +8 -17
- package/src/content/pages/overview/introduction.mdx +1 -1
- package/src/css/custom.css +0 -5
|
@@ -4,6 +4,7 @@ settings: components
|
|
|
4
4
|
---
|
|
5
5
|
|
|
6
6
|
# Frameworks
|
|
7
|
+
|
|
7
8
|
Fulldev UI is written in vanilla CSS and .astro files. It is framework agnostic.
|
|
8
9
|
|
|
9
10
|
## JS frameworks
|
|
@@ -13,7 +14,6 @@ All styles in Fulldev UI use regular CSS and classes. Classes use the following
|
|
|
13
14
|
- Component classes are the same as the component name, like `button` for `<Button>`.
|
|
14
15
|
- Prop classes have the prop name as prefix, like `variant-primary` for `<Button variant="primary">`.
|
|
15
16
|
- If a prop is a boolean the class is added without a prefix, like `contrast`.
|
|
16
|
-
- To prevent conflicts, all styles only apply if there is a `full` class on the element too.
|
|
17
17
|
|
|
18
18
|
This means you can apply Fulldev UI styles to any framework component as follows:
|
|
19
19
|
|
|
@@ -22,7 +22,7 @@ This means you can apply Fulldev UI styles to any framework component as follows
|
|
|
22
22
|
import Button from 'fulldev-ui/components/Button.astro'
|
|
23
23
|
---
|
|
24
24
|
|
|
25
|
-
<a class="
|
|
25
|
+
<a class="button variant-primary contrast radius-auto"> Button </a>
|
|
26
26
|
<Button contrast> Button </Button>
|
|
27
27
|
```
|
|
28
28
|
|
|
@@ -47,16 +47,6 @@ export default defineConfig({
|
|
|
47
47
|
|
|
48
48
|
In your `uno.config.ts` add the following:
|
|
49
49
|
|
|
50
|
-
```ts
|
|
51
|
-
// uno.config.ts
|
|
52
|
-
import fulldevUI from 'fulldev-ui/unocss'
|
|
53
|
-
|
|
54
|
-
export default defineConfig({
|
|
55
|
-
presets: [fulldevUI],
|
|
56
|
-
})
|
|
57
|
-
```
|
|
58
|
-
|
|
59
|
-
|
|
60
50
|
```ts
|
|
61
51
|
// uno.config.ts
|
|
62
52
|
import fulldevUI from 'fulldev-ui/unocss'
|
|
@@ -72,9 +62,10 @@ The following classes are available when using the Tailwind plugin or UnoCSS pre
|
|
|
72
62
|
|
|
73
63
|
### Spacing
|
|
74
64
|
|
|
75
|
-
The following spacing classes are added to your tailwind/uno config.
|
|
65
|
+
The following spacing classes are added to your tailwind/uno config.
|
|
76
66
|
|
|
77
67
|
You can use them like `p-space-1`, `m-space-1`, `h-space-1`, `w-space-1`, etc.
|
|
68
|
+
|
|
78
69
|
```ts
|
|
79
70
|
spacing: {
|
|
80
71
|
'space-1': 'var(--space-1)',
|
|
@@ -89,7 +80,7 @@ spacing: {
|
|
|
89
80
|
|
|
90
81
|
### Font size
|
|
91
82
|
|
|
92
|
-
The following spacing classes are added to your tailwind/uno config.
|
|
83
|
+
The following spacing classes are added to your tailwind/uno config.
|
|
93
84
|
|
|
94
85
|
You can use them like `text-1`, `text-2`, `text-3`, etc.
|
|
95
86
|
|
|
@@ -108,7 +99,7 @@ fontSize: {
|
|
|
108
99
|
|
|
109
100
|
### Border radius
|
|
110
101
|
|
|
111
|
-
The following border radius classes are added to your tailwind/uno config.
|
|
102
|
+
The following border radius classes are added to your tailwind/uno config.
|
|
112
103
|
|
|
113
104
|
You can use them like `rounded-1`, `rounded-2`, `rounded-3`, etc.
|
|
114
105
|
|
|
@@ -122,7 +113,7 @@ borderRadius: {
|
|
|
122
113
|
|
|
123
114
|
### Color classes
|
|
124
115
|
|
|
125
|
-
The following color classes are added to your tailwind/uno config.
|
|
116
|
+
The following color classes are added to your tailwind/uno config.
|
|
126
117
|
|
|
127
118
|
You can use them like `bg-color-1`, `text-base-2`, `border-base-6`, etc.
|
|
128
119
|
|
|
@@ -177,4 +168,4 @@ colors: {
|
|
|
177
168
|
background: 'var(--color-brand-background)',
|
|
178
169
|
}
|
|
179
170
|
}
|
|
180
|
-
```
|
|
171
|
+
```
|
package/src/css/custom.css
CHANGED