Padrões
Buscar
Tela de busca com search bar persistente e ativa, chips de filtro e resultados mistos de discos e pessoas.
Visão geral
Anatomia
1
Search Bar
Borda ativa border:1.5px solid #C8F53C. Ícone de busca lime. Campo com placeholder/valor. Botão "Cancelar" à direita. Persistente no topo.
2
Chips de filtro
Scroll horizontal. Ativo: bg-lime/15 border-lime/35 color:#C8F53C. Inativo: bg-[#1a1a1a] color:#888. Filtros: Tudo, Discos, Pessoas, Gênero.
3
Resultado de disco
Thumbnail w-11 h-11 rounded-lg + título + artista + label badge "Disco". Chevron direito indica navegação.
4
Resultado de pessoa
Avatar circular + display_name + @username + contagem de discos + botão "Seguir" / "Seguindo" à direita.
Estados
Sem resultados para
"xyzabc"
Estado vazio
Sugestões
Jazz
MPB
Rock
Estado de sugestões (campo vazio)
Specs
| Elemento | Valor |
|---|---|
| Search bar border ativa | 1.5px solid #C8F53C |
| Search bar bg | #1a1a1a, border-radius:12px |
| Search bar altura | 40px |
| Chip ativo bg | rgba(200,245,60,0.15) |
| Chip ativo border | rgba(200,245,60,0.35) |
| Chip inativo bg | #1a1a1a |
| Resultado thumbnail | 44×44px border-radius:8px |
| Resultado avatar | 44×44px border-radius:50% |