Criar biblioteca base de componentes reutilizáveis, desacoplados de layout específico para adaptação ao Figma.
📦 Escopo
🔘 <Button />
- Variantes:
primary, secondary, ghost
- Props para tamanho
- Aceitar
children
- Preparado para futura animação
📦 <Container />
- Centralização padrão
max-width consistente- Padding horizontal responsivo
🏷 <SectionTitle />
- Título principal
- Subtítulo opcional
- Estrutura preparada para animação individual
🧾 <Card />
- Estrutura flexível
- Suporte para ícone, título e descrição
- Não acoplado a layout específico
💻 <FileExplorer />
- Estrutura base da seção do laptop
- Lista mockada de arquivos
- Componente individual para item de arquivo
🧭 <Navbar />
- Estrutura base
- Links âncora
- Preparado para scroll spy futuro
🧱 <Footer />
- Estrutura em grid
- Organização clara de conteúdo
✅ Critérios de Aceite
- Componentes desacoplados
- Reutilizáveis em múltiplas seções
- Sem dependência estrutural específica
- Código limpo e tipado (se TypeScript)
Criar biblioteca base de componentes reutilizáveis, desacoplados de layout específico para adaptação ao Figma.
📦 Escopo
🔘
<Button />primary,secondary,ghostchildren📦
<Container />max-widthconsistente🏷
<SectionTitle />🧾
<Card />💻
<FileExplorer />🧭
<Navbar />🧱
<Footer />✅ Critérios de Aceite