Componentes base
O que a interface inteira vai usar daqui pra frente. Tudo sai de src/lib/design-tokens.ts. Redimensione a janela: 390px é o desenho de origem, 820px é o tablet de campo, 1280px é o escritório.
Cores
Verde e azul da marca são preenchimento, nunca cor de texto sobre fundo claro. A tabela de contraste abaixo é a trava.
| Token | Razão | Serve como texto? | Uso |
|---|---|---|---|
| text.primary | 15.8:1 | Sim | titulos, enfase |
| text.secondary | 7.2:1 | Sim | corpo padrao |
| text.muted | 2.3:1 | Não | caption decorativa apenas |
| accent.green | 2.9:1 | Não | preenchimento; texto por cima em carvao |
| accent.blue | 2.5:1 | Não | preenchimento e decoracao |
| accent.greenActive | 3.4:1 | Não | borda de UI sobre branco (>= 3:1) |
| status.plantada | 6.4:1 | Sim | texto de sucesso |
| feedback.dangerIcon | 4.1:1 | Não | icone e borda; texto so em >= 18px bold |
| feedback.dangerStrong | 5.5:1 | Sim | texto e borda de acao destrutiva |
Tipografia
Exo 2 nos títulos, Maven Pro no corpo. Escala de origem em 390px.
Cada árvore no mapa
Talhão Sul, 128 mudas
Crescimento nos últimos 12 meses
Dados dendrométricos
Verificada
Proveniência
Cada muda vira um ponto georreferenciado no instante do plantio, e a cobertura da área fica visível e auditável.
Retirada por maturidade é sinal de sobrevivência confirmada.
Medição registrada em campo, com evidência geolocalizada.
Atualizado há 3 minutos
Button
Altura padrão 52px. Em campo (tablet) sobe para 60px: luva, dedo maior, tela ao sol.
Input
Altura 52px, label flutuante, 16px de fonte para travar o zoom do iOS.
Opcional. Ajuda a achar depois.
Capturada pelo GPS no ato do registro.
Precisamos de um e-mail válido para vincular o registro.
Mínimo de 8 caracteres.
Card
Raio 16px, sombra suave. A variante interativa responde a toque, Enter e Espaço.
Talhão Sul
128 mudas registradas, 94% com evidência de campo.
- Área calculada
- 4,2 ha
- Área declarada
- 4,0 ha
- Coroas em campo
- 112
Card interativo
Toque, Enter ou Espaço abrem o bottom sheet.
Estado vazio
Nenhuma árvore por aqui ainda. Que tal plantar a primeira?
BottomSheet
Substitui todo dropdown nativo (kickoff 6.3). Arraste para baixo, toque no fundo ou pressione Esc para fechar. No desktop vira diálogo centrado.
Alvos de toque
O tablet é o dispositivo de campo recomendado, e campo exige alvo maior que o padrão.