Interface intuitiva para compras digitais com foco em acessibilidade
🔍 Funcionalidades
✅ Navegação por seções: Home, Produtos, Ofertas, Contato, Sobre e Carrinho
🛍️ Vitrine de produtos por categoria com ícones e descrições
🧾 Carrinho de compras com cálculo automático de total
🌙 Alternância de tema claro/escuro com persistência via localStorage
📱 Layout responsivo para dispositivos móveis
📦 Menu dinâmico carregado via Fetch API
🚀 Tecnologias Utilizadas
| Ferramenta | Finalidade |
|---|---|
| HTML5 | Estrutura semântica e acessível |
| CSS3 | Estilização responsiva e moderna |
| JavaScript | Interatividade, carrinho e alternância de tema |
| LocalStorage | Persistência do tema escolhido pelo usuário |
| Fetch API | Carregamento dinâmico de componentes |
📁 Estrutura do Projeto
comprix-supermercado/ ├── index.html ├── style/ │ └── style.css ├── script.js ├── components/ │ └── menu.html ├── assets/ │ └── banner.png └── README.md
🎯 Funcionalidades
=> Página inicial com destaques e benefícios => Vitrine de produtos por categoria (Frutas, Laticínios, Padaria, Limpeza) => Seção de ofertas especiais com descontos => Carrinho de compras com cálculo automático de total => Alternância entre modo claro e escuro com ícones ☀️/🌙 => Menu dinâmico carregado via 'fetch' => Informações de contato e sobre a empresa
📦 Como Executar
-
Clone o repositório: ``bash git clone https://github.com/helenamarcomini22/comprix-supermercado.git cd comprix-supermercado
-
Abra o arquivo index.html em seu navegador:
./index.html
Não é necessário instalar dependências — o projeto é 100% em HTML, CSS e JS puro.
🌐 Deploy Você pode visualizar o projeto online via GitHub Pages: 🔗 https://helenamarcomini22.github.io/comprix-supermercado
📸 Capturas de Tela
🧠 Aprendizados Durante o desenvolvimento deste projeto, aprimorei:
Manipulação de DOM com JavaScript puro Boas práticas de organização de código e componentes Design responsivo e acessível Persistência de dados com localStorage
📬 Contato
Feito com 💚 por Helena Marcomini • Desenvolvedora apaixonada por tecnologia