chore(agent): documentar obrigatoriedade de Google Sans e @lucide/vue em rules e skills de UX

This commit is contained in:
Luiz Silva 2026-10-21 00:37:14 -03:00
parent 20663b7f6a
commit eaf2cb600c
2 changed files with 10 additions and 11 deletions

View file

@ -17,10 +17,11 @@ Usado nos módulos voltados a empresas privadas e gestão corporativa.
### Características
- **Framework UI:** Vuetify (Vue 3) / `eli-vue`
- **Cores:** paleta própria definida no tema Vuetify do projeto
- **Tipografia:** controlada pelo tema Vuetify
- **Componentes:** componentes Vuetify (`v-btn`, `v-card`, `v-data-table`, etc.)
- **Framework UI:** Vuetify (Vue 3) / `eli-vue` ou Tailwind CSS v4 (módulos verdes e-Licencie `#688c00`)
- **Cores:** paleta própria definida no tema do projeto (`#688c00` verde floresta e-Licencie)
- **Tipografia Obrigatória:** **`Google Sans`** (Variable Font 100–900 carregada via `@font-face` do MinIO Paiol: `https://paiol.idz.one/estaticos/GoogleSans/GoogleSans-VariableFont_GRAD,opsz,wght.ttf` e `GoogleSans-Italic-VariableFont_GRAD,opsz,wght.ttf`). Proibido uso de fontes genéricas ou `font-mono` em badges/valores (usar `tabular-nums` com `Google Sans`).
- **Iconografia Obrigatória:** **`@lucide/vue`** exclusivamente. É proibido usar `lucide-vue-next`, `@mdi/font`, SVGs inline ou caracteres Unicode/ASCII (`└`, `➔`) como ícones visuais.
- **Componentes:** componentes Vuetify (`v-btn`, `v-card`, `v-data-table`, etc.) ou componentes modulares Vue 3
- **Estilo visual:** moderno, tech, voltado a usabilidade corporativa
### Quando aplicar

View file

@ -139,11 +139,11 @@ Para cada elemento da interface, avaliar:
- [ ] Em mobile, os elementos empilham verticalmente sem quebra visual?
- [ ] Modais têm largura proporcional ao conteúdo?
#### Tipografia
#### Tipografia — Google Sans (obrigatório)
- [ ] Tamanhos de fonte seguem a escala: 12px (caption), 14px (body), 16px (subtitle), 20px (title), 24px (heading)?
- [ ] Textos longos usam `line-height: 1.5` para legibilidade?
- [ ] Labels de formulário são visualmente distintos do conteúdo preenchido?
- [ ] A fonte **`Google Sans`** (Variable Font 100–900 via `@font-face` de `https://paiol.idz.one/estaticos/GoogleSans/GoogleSans-VariableFont_GRAD,opsz,wght.ttf`) está aplicada em todo o sistema (`--font-sans` e `--eli-font-family`)?
- [ ] Proibido `font-mono` em contadores, códigos e valores: usar `tabular-nums` com `Google Sans`.
- [ ] Escala: 12px (caption), 14px (body), 16px (subtitle), 20px (title), 24px (heading); `line-height: 1.5` em textos longos.
#### Acessibilidade básica
@ -169,9 +169,7 @@ Ao implementar melhorias, seguir os padrões do ecossistema:
Todos os ícones do projeto devem vir exclusivamente da biblioteca **`@lucide/vue`** (dependência já instalada no `package.json`).
**Proibido**:
- SVG inline manual (hardcoded no template)
- Ícones de `@mdi/font` ou Material Design Icons em componentes do projeto
- Bibliotecas alternativas (Font Awesome, Heroicons, etc.)
- `lucide-vue-next`, `@mdi/font`, Font Awesome, Heroicons, SVGs inline manuais ou caracteres ASCII/Unicode (`└`, `➔`) como ícones.
**Como usar**: