Sou um profissional de TI dedicado, professor de Educação Profissional e Tecnologia, sempre em busca de inovações que impulsionem a eficiência nos negócios e no aprendizado. Minha paixão por tecnologia me motiva a enfrentar desafios com soluções criativas e eficazes. Atualmente, estou à procura de uma oportunidade como Desenvolvedor Front-end, focando em HTML, CSS e JavaScript para construir experiências de usuário intuitivas e impactantes.
🌐 Vamos nos conectar e colaborar para inovar!
Projeto AmaBioTech - Biomas Brasileiros Este projeto foi desenvolvido para o "Dia D" na Escola Doutor Silva Mello com a turma do 1º ano do curso de Informática para Internet. O site explora os biomas brasileiros, com foco em um design interativo e responsivo.
Estrutura HTML O HTML organiza o site em três partes principais:
Cabeçalho (header): Contém o logotipo e o menu de navegação. O menu é responsivo e exibido como um botão que abre links para as seções do site (Home, About, Explore, Gallery, Contact).
Seção principal (section class="home"): Exibe uma apresentação dos biomas com uma galeria de imagens e descrições detalhadas. Cada bioma aparece como um item rotativo, controlado por botões de navegação no rodapé da seção.
Rodapé com links sociais: Ícones de mídia social redirecionam o usuário para páginas externas.
Estilos CSS Estilização básica: O arquivo CSS aplica margens, fontes e cores. A fonte Poppins, importada do Google Fonts, define um visual moderno.
Cabeçalho e Menu Responsivo: O cabeçalho adapta-se a diferentes resoluções de tela, com o menu alternando entre visualizações desktop e mobile.
Galeria de Imagens: Cada imagem de bioma é animada com um efeito de transição circular, ajustado para criar uma apresentação dinâmica.
Responsividade: Regras @media ajustam o layout para telas menores, tornando o site responsivo e fácil de navegar em dispositivos móveis.
JavaScript Interativo O JavaScript adiciona interatividade ao site:
Menu de Navegação Responsivo: Um botão de menu ("menu-btn") ativa ou desativa a visibilidade do menu principal.
Controle de Slides e Conteúdo: A função sliderNav ativa manualmente cada item da galeria, alternando entre biomas e descrições quando os botões de navegação são clicados.
Como Usar o Projeto Clone o repositório. Abra o index.html em um navegador. Use os botões de navegação para explorar as informações dos biomas. Esse README detalha a estrutura do projeto, destacando os objetivos educacionais e interativos para o Dia D na escola.
Javascript, HTML5, CSS3...
Email: hillybrito@gmail.com
Instagram: @hillybrito