https://github.com/efureev/fint-ds
Vue 3 design system package with components, styles, directives, and localization helpers
https://github.com/efureev/fint-ds
component-library design-system ui unocss vue
Last synced: 11 days ago
JSON representation
Vue 3 design system package with components, styles, directives, and localization helpers
- Host: GitHub
- URL: https://github.com/efureev/fint-ds
- Owner: efureev
- Created: 2026-04-08T07:42:33.000Z (3 months ago)
- Default Branch: main
- Last Pushed: 2026-04-15T17:41:58.000Z (3 months ago)
- Last Synced: 2026-04-15T18:28:10.053Z (3 months ago)
- Topics: component-library, design-system, ui, unocss, vue
- Language: Vue
- Homepage: https://efureev.github.io/fint-ds/
- Size: 1.19 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Fint-DS (Vue 3)
`@feugene/fint-ds` is a Vue 3 design-system package. Consumers install the published package and use the build artifacts from `dist`.
Русская версия: [`docs/ru/installation.md`](./docs/ru/installation.md)
## Documentation
- [`docs/en/installation.md`](./docs/en/installation.md) — installation, UnoCSS setup, plugin registration
- [`docs/en/styling.md`](./docs/en/styling.md) — styles, themes, CSS variables, customization
- [`docs/en/localization.md`](./docs/en/localization.md) — built-in i18n, `vue-i18n`, `@feugene/fint-i18n`
- [`docs/en/directives.md`](./docs/en/directives.md) — package directives
Russian documentation:
- [`docs/ru/installation.md`](./docs/ru/installation.md)
- [`docs/ru/styling.md`](./docs/ru/styling.md)
- [`docs/ru/localization.md`](./docs/ru/localization.md)
- [`docs/ru/directives.md`](./docs/ru/directives.md)
## Quick start
1. Install the package:
```bash
yarn add @feugene/fint-ds
```
2. Import the package styles once in `main.ts`:
```ts
import '@feugene/fint-ds/styles.css'
```
If your app already uses UnoCSS, keep that setup on the app side and continue importing its reset / `virtual:uno.css` as usual.
3. Apply the theme before mounting the app:
```ts
import { initThemeEarly } from '@feugene/fint-ds'
initThemeEarly()
```
4. Register the plugin:
```ts
import { createApp } from 'vue'
import FintDs from '@feugene/fint-ds'
createApp(App)
.use(FintDs)
.mount('#app')
```
For the full setup, see [`docs/en/installation.md`](./docs/en/installation.md).