@flitsmeister/design-system 2.2.1 → 2.2.2
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 +12 -1
- package/package.json +4 -2
package/README.md
CHANGED
|
@@ -25,7 +25,6 @@ Design tokens are exported as platform-specific files in `tokens/schema_exports/
|
|
|
25
25
|
|
|
26
26
|
- This will provide all color, spacing, and other design tokens as CSS custom properties. You can use these variables directly in your own CSS or with Tailwind.
|
|
27
27
|
|
|
28
|
-
> **Note:** No bundled `main.css` is provided. You must import the relevant CSS export(s) for your use case.
|
|
29
28
|
|
|
30
29
|
### 2. Using Vue Components
|
|
31
30
|
|
|
@@ -37,6 +36,18 @@ import { fmxButton, fmxInput } from "@flitsmeister/design-system";
|
|
|
37
36
|
|
|
38
37
|
These are standard Vue 3 single-file components. Register and use them in your app as you would any other Vue component.
|
|
39
38
|
|
|
39
|
+
### 3. Using Icons
|
|
40
|
+
|
|
41
|
+
SVG icon files are available via the `icons/` export path. You can import any icon directly:
|
|
42
|
+
|
|
43
|
+
```js
|
|
44
|
+
import iconCar from '@flitsmeister/design-system/icons/filled/car.svg';
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
You can also reference icons by their path for use in `<img>`, `<svg>`, or as assets in your build system.
|
|
48
|
+
|
|
49
|
+
> **Browse all available icons and their names at:** [https://fmdx.netlify.app/icons](https://fmdx.netlify.app/icons)
|
|
50
|
+
|
|
40
51
|
---
|
|
41
52
|
|
|
42
53
|
## About the Design System
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@flitsmeister/design-system",
|
|
3
|
-
"version": "2.2.
|
|
3
|
+
"version": "2.2.2",
|
|
4
4
|
"description": "Flitsmeister design system and demo site",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"exports": {
|
|
@@ -8,7 +8,9 @@
|
|
|
8
8
|
"./fmxInput": "./web/components/fmxInput.vue",
|
|
9
9
|
"./fmxButton": "./web/components/fmxButton.vue",
|
|
10
10
|
"./main.css": "./dist-lib/main.css",
|
|
11
|
-
"./themes/*": "./tokens/schema_exports/*"
|
|
11
|
+
"./themes/*": "./tokens/schema_exports/*",
|
|
12
|
+
"./components/*": "./web/components/*",
|
|
13
|
+
"./icons/*": "./web/icons/*"
|
|
12
14
|
},
|
|
13
15
|
"scripts": {
|
|
14
16
|
"dev": "vite",
|