56 lines
1.3 KiB
Markdown
56 lines
1.3 KiB
Markdown
# 🎨 Guia Rápido de Classes Dark Mode
|
|
|
|
## Classes Comuns para Substituir
|
|
|
|
### Backgrounds
|
|
```
|
|
bg-white → bg-white dark:bg-gray-800
|
|
bg-gray-50 → bg-gray-50 dark:bg-gray-900
|
|
bg-gray-100 → bg-gray-100 dark:bg-gray-800
|
|
bg-gray-200 → bg-gray-200 dark:bg-gray-700
|
|
```
|
|
|
|
### Textos
|
|
```
|
|
text-gray-900 → text-gray-900 dark:text-gray-100
|
|
text-gray-800 → text-gray-800 dark:text-gray-200
|
|
text-gray-700 → text-gray-700 dark:text-gray-300
|
|
text-gray-600 → text-gray-600 dark:text-gray-400
|
|
text-gray-500 → text-gray-500 dark:text-gray-500
|
|
```
|
|
|
|
### Bordas
|
|
```
|
|
border-gray-200 → border-gray-200 dark:border-gray-700
|
|
border-gray-300 → border-gray-300 dark:border-gray-600
|
|
```
|
|
|
|
### Hover States
|
|
```
|
|
hover:bg-gray-50 → hover:bg-gray-50 dark:hover:bg-gray-700
|
|
hover:bg-gray-100 → hover:bg-gray-100 dark:hover:bg-gray-800
|
|
```
|
|
|
|
### Inputs
|
|
```
|
|
bg-white border-gray-300 text-gray-900
|
|
→
|
|
bg-white dark:bg-gray-800 border-gray-300 dark:border-gray-700 text-gray-900 dark:text-gray-100
|
|
```
|
|
|
|
## Componentes Já Atualizados
|
|
- [x] Layout
|
|
- [x] Header
|
|
- [x] Sidebar
|
|
- [x] Button
|
|
- [x] Modal
|
|
- [x] ThemeToggle
|
|
- [x] Dashboard (parcial)
|
|
|
|
## Componentes Pendentes
|
|
- [ ] DatabookView
|
|
- [ ] Templates
|
|
- [ ] Configurações
|
|
- [ ] Todos os formulários
|
|
- [ ] Todas as tabelas
|