Nesta aula, exploramos os componentes cards e listas, que organizam e apresentam informações de forma modular, clara e acessível. Esses elementos são amplamente usados em interfaces para facilitar a navegação e interação do usuário.

Pontos principais da aula:

1. O que são cards?

   • Contêineres visuais que agrupam conteúdo relacionado, como textos, imagens e ações.

   • Podem ser interativos ou apenas organizadores visuais.

2. Boas práticas para cards:

   • Consistência visual: Cards semelhantes devem ter tamanhos, cores e tipografias alinhadas.

   • Hierarquia tipográfica: Separar títulos, subtítulos e descrições com estilos e tamanhos variados.

   • Espaçamento: Manter padding interno e margens externas consistentes para evitar desordem.

   • Interatividade: Fornecer feedback visual claro (como hover ou mudança de cor) para ações interativas.

3. O que são listas?

   • Componentes usados para organizar itens sequenciais, como textos e ícones, horizontal ou verticalmente.

   • Oferecem agrupamento lógico e podem ser simples ou ricas em interatividade, como listas clicáveis.

4. Características essenciais de listas:

   • Cabeça de chave: O item mais importante deve ser destacado e posicionado à esquerda.

   • Separação visual: Uso de bordas, cores ou espaçamento para distinguir itens.

   • Estilos minimalistas: Interfaces mais simples podem usar apenas alinhamento e hierarquia para organização.