commit e43fb531e1baed717a4011b4fc1d7d588cf01758 Author: Felipe de Moraes Gomes Date: Tue May 12 16:40:15 2026 -0300 Adicionar Funcionalidade diff --git a/Funcionalidade.md b/Funcionalidade.md new file mode 100644 index 0000000..29f2aa3 --- /dev/null +++ b/Funcionalidade.md @@ -0,0 +1,117 @@ +# README — Landing Page Banda Larga + +## 1. Visão Geral + +Este projeto consiste em uma landing page para venda de planos de banda larga residencial e empresarial. + +A implementação contempla: + +- Segmentação entre planos residenciais e empresariais +- Integração com formulários FormCraft +- Persistência de dados entre páginas +- Responsividade para diferentes dispositivos +- Navegação com smooth scroll +- Ajustes personalizados em JavaScript e CSS + +--- + +# 2. Estrutura Geral da Página + +A landing page é composta pelas seguintes seções: + +- Sliders com imagens de Banda Larga Residencial e Empresarial +- Seção de planos residenciais +- Seção de planos empresariais +- Página de formulário de viabilidade +- Página de formulário de contratação + +Os planos são organizados em duas categorias principais: + +- Residencial +- Empresarial + +--- + +# 3. Segmentação de Planos + +Foi implementado um sistema de identificação automática do tipo de plano selecionado pelo usuário. + +## Funcionalidades + +- Banner individual para cada plano utilizando HTML e CSS +- Captura de clique nos botões de planos +- Salvamento das informações para a página de viabilidade +- Identificação automática do tipo de plano escolhido + +--- + +# 4. Seleção Automática de Plano no Formulário + +O sistema realiza a pré-seleção automática do plano escolhido anteriormente pelo usuário. + +## Funcionalidades + +- Localização dinâmica do input correspondente ao plano +- Marcação automática do plano selecionado +- Disparo de eventos para integração com o FormCraft + +--- + +# 5. Integração com FormCraft + +A landing page utiliza formulários desenvolvidos com o plugin FormCraft. + +## Ajustes realizados + +- Atualização das configurações do FormCraft +- JavaScript adicional para alterar posicionamento e fluxo do formulário de viabilidade +- Persistência do plano escolhido entre as páginas 1, 2 e 3 utilizando cache/local storage + +--- + +# 6. Responsividade + +A aplicação foi otimizada para diferentes resoluções de tela. + +## Breakpoints principais + +| Dispositivo | Resolução | +|---|---| +| Desktop | > 1024px | +| Tablet | 768px – 1024px | +| Mobile | < 480px | + +## Problemas tratados + +- Controle de altura de campos customizados +- Correções de comportamento em dispositivos móveis +- Conflitos entre `flex-wrap` e altura fixa +- Sobreposição de elementos em mobile +- Ajustes de headings em telas pequenas + +--- + +# 7. Smooth Scroll + +Foi implementado um sistema de rolagem suave para melhorar a navegação entre seções da página. + +## Características + +- Offset dinâmico para compensar header fixo +- Controle de duração da animação +- Ajuste automático de posicionamento + +--- + +# 8. Tecnologias Utilizadas + +- HTML5 +- CSS3 +- JavaScript +- WordPress + +--- + +# 9. Conclusão + +A landing page de banda larga foi estruturada para suportar múltiplos tipos de planos, integração com formulários dinâmicos e responsividade. \ No newline at end of file