✨ Dark Mode Portfolio ✨

Um portfólio profissional moderno com tema escuro e design responsivo

Badges

Índice

• Descrição do Projeto
• Status do Projeto
• Funcionalidades
• Layout e Design
• Tecnologias Utilizadas
• Como Usar
• Licença

Descrição do Projeto

Um portfólio profissional com tema escuro, desenvolvido com HTML, CSS e JavaScript vanilla. O projeto apresenta um design moderno e elegante, com animações suaves e uma experiência de usuário intuitiva.

Status do Projeto

🚧 Em Desenvolvimento

Funcionalidades

• ✨ Design responsivo para todos os dispositivos
• 🌙 Tema escuro nativo
• 🎯 Animações suaves no scroll
• 🎠 Carrossel de projetos interativo
• 📱 Menu mobile responsivo
• 📝 Formulário de contato funcional
• 🔗 Links para redes sociais
• ⚡ Navegação suave entre seções
• 🖼️ Modal para detalhes dos projetos
• ⏳ Timeline profissional interativa

Demonstração:

20250310_233129.mp4

Layout e Design

Sistema de Cores

:root {
  --background: #0a0a0a;
  --foreground: #f5f5f5;
  --card-bg: #1a1a1a;
  --card-border: #2a2a2a;
  --primary: #3633ea;
  --primary-hover: #2289ce;
  --primary-light: rgba(51, 161, 234, 0.2);
  --secondary: #2a2a2a;
  --secondary-hover: #3a3a3a;
  --muted: #6b7280;
}

Breakpoints Responsivos

• 📱 Mobile: < 768px
• 💻 Desktop: ≥ 768px

Tecnologias Utilizadas

• HTML5 Semântico
• CSS3 (com variáveis CSS)
• JavaScript Vanilla
• Font Awesome 6.4.0
• Google Fonts
• Animações CSS
• Sistema de Grid CSS
• Flexbox

Como Usar

1. Clone o repositório:

git clone https://github.com/amaro-netto/dark-mode-portfolio.git

2. Navegue até o diretório:

cd dark-mode-portfolio

3. Instale o servidor local:

npm install serve

4. Inicie o servidor:

npm start

Estrutura do Projeto

dark-mode-portfolio/
├── index.html
├── styles.css
├── script.js
└── public/
    ├── perfil.jpg
    ├── placeholder.png
    └── placeholder-logo.png

Pessoas Desenvolvedoras do Projeto

• Amaro Netto - Desenvolvedor principal

Licença

Este projeto está sob a licença MIT. Veja o arquivo LICENSE para mais detalhes.