@regardio/brand 0.8.0 → 0.8.1
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 +26 -11
- package/package.json +3 -8
package/README.md
CHANGED
|
@@ -115,8 +115,8 @@ import { CompassSprite } from "@regardio/brand/sprites/compass-sprite";
|
|
|
115
115
|
|
|
116
116
|
Import `colors.css` to use the Regardio color palette with Tailwind CSS v4:
|
|
117
117
|
|
|
118
|
-
```
|
|
119
|
-
import "@regardio/brand/colors.css";
|
|
118
|
+
```css
|
|
119
|
+
@import "@regardio/brand/styles/colors.css";
|
|
120
120
|
```
|
|
121
121
|
|
|
122
122
|
This provides CSS custom properties using the `@theme` directive, making colors
|
|
@@ -137,17 +137,33 @@ Each color has shades from `50` (lightest) to `950` (darkest):
|
|
|
137
137
|
The compass sprites use these colors via Tailwind classes (e.g., `fill-green-300`),
|
|
138
138
|
so the color scheme must be loaded for sprites to render correctly.
|
|
139
139
|
|
|
140
|
+
### Design System Styles
|
|
141
|
+
|
|
142
|
+
Import the complete design system (colors, tokens, typography, base styles, grid):
|
|
143
|
+
|
|
144
|
+
```css
|
|
145
|
+
@import "@regardio/brand/styles/index.css";
|
|
146
|
+
```
|
|
147
|
+
|
|
148
|
+
Or import individual style modules:
|
|
149
|
+
|
|
150
|
+
```css
|
|
151
|
+
@import "@regardio/brand/styles/colors.css";
|
|
152
|
+
@import "@regardio/brand/styles/tokens.css";
|
|
153
|
+
@import "@regardio/brand/styles/typography.css";
|
|
154
|
+
@import "@regardio/brand/styles/base.css";
|
|
155
|
+
@import "@regardio/brand/styles/grid.css";
|
|
156
|
+
```
|
|
157
|
+
|
|
140
158
|
### Grid System
|
|
141
159
|
|
|
142
160
|
Regardio's standard container and grid layout utilities:
|
|
143
161
|
|
|
144
|
-
```
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
<div
|
|
148
|
-
|
|
149
|
-
<div className="u-grid-half">Column 1</div>
|
|
150
|
-
<div className="u-grid-half">Column 2</div>
|
|
162
|
+
```html
|
|
163
|
+
<div class="u-container">
|
|
164
|
+
<div class="u-grid">
|
|
165
|
+
<div class="u-grid-half">Column 1</div>
|
|
166
|
+
<div class="u-grid-half">Column 2</div>
|
|
151
167
|
</div>
|
|
152
168
|
</div>
|
|
153
169
|
```
|
|
@@ -172,8 +188,7 @@ See [Grid System documentation](./docs/grid-system.md) for complete usage guide.
|
|
|
172
188
|
| Export | Description |
|
|
173
189
|
|--------|-------------|
|
|
174
190
|
| `@regardio/brand/button` | Branded button component |
|
|
175
|
-
| `@regardio/brand/styles
|
|
176
|
-
| `@regardio/brand/colors.css` | Tailwind v4 theme with Regardio color palette |
|
|
191
|
+
| `@regardio/brand/styles/*` | Design system CSS modules (index, colors, tokens, typography, base, grid) |
|
|
177
192
|
| `@regardio/brand/icons/*` | Icon and logo React components |
|
|
178
193
|
| `@regardio/brand/sprites/*` | Compass sprite components |
|
|
179
194
|
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://www.schemastore.org/package.json",
|
|
3
3
|
"name": "@regardio/brand",
|
|
4
|
-
"version": "0.8.
|
|
4
|
+
"version": "0.8.1",
|
|
5
5
|
"private": false,
|
|
6
6
|
"description": "Regardio Brand Assets",
|
|
7
7
|
"homepage": "https://github.com/regardio/brand#readme",
|
|
@@ -22,12 +22,7 @@
|
|
|
22
22
|
"import": "./dist/components/button.mjs",
|
|
23
23
|
"default": "./dist/components/button.mjs"
|
|
24
24
|
},
|
|
25
|
-
"./styles": {
|
|
26
|
-
"style": "./dist/styles/index.css",
|
|
27
|
-
"default": "./dist/styles/index.css"
|
|
28
|
-
},
|
|
29
25
|
"./styles/*": "./dist/styles/*",
|
|
30
|
-
"./colors.css": "./dist/styles/colors.css",
|
|
31
26
|
"./sprites/*": "./dist/generated/sprites/*",
|
|
32
27
|
"./icons/*": "./dist/generated/icons/*",
|
|
33
28
|
"./icons/regardio-ensemble-icon-color": {
|
|
@@ -145,8 +140,8 @@
|
|
|
145
140
|
},
|
|
146
141
|
"dependencies": {
|
|
147
142
|
"@fontsource-variable/georama": "5.2.8",
|
|
148
|
-
"@regardio/react": "^0.8.
|
|
149
|
-
"@regardio/tailwind": "^0.4.
|
|
143
|
+
"@regardio/react": "^0.8.1",
|
|
144
|
+
"@regardio/tailwind": "^0.4.2"
|
|
150
145
|
},
|
|
151
146
|
"devDependencies": {
|
|
152
147
|
"@regardio/dev": "^1.18.0",
|