Este projeto é um site da SpaceX, uma fabricante aeroespacial privada e empresa de transporte espacial. O site contém informações sobre o foguete Falcon 9 e missões de voos espaciais tripulados.
O projeto utiliza as seguintes tecnologias:
- HTML
- CSS
- SASS
- Bootstrap 5.0.2
- AOS (Animate On Scroll) Library
O projeto é estruturado em diversos arquivos e pastas. Aqui está uma visão geral da estrutura de arquivos:
index.html Página inicial do site.
falcon9.html Página sobre o foguete Falcon 9.
humanSpace.html Página sobre voos espaciais tripulados.
css/style.css Arquivo CSS principal.
scss/style.scss Arquivo SCSS principal que importa outros arquivos SCSS.
scss/communElements/variables.scss Arquivo com variáveis de estilo compartilhadas.
scss/communElements/communElements.scss Arquivo com estilos comuns compartilhados.
scss/pages/home.scss Arquivo com estilos específicos da página inicial.
scss/pages/falcon9.scss Arquivo com estilos específicos da página Falcon 9.
scss/pages/humanSpace.scss Arquivo com estilos específicos da página Human Spaceflight.
img/ Pasta contendo imagens utilizadas no site.
A página inicial (index.html) apresenta uma seção com missões futuras e concluídas da SpaceX, fornecendo uma visão geral das atividades da empresa.
A página do Falcon 9 (falcon9.html) fornece uma visão detalhada do foguete Falcon 9. Ela inclui informações sobre o foguete, como números de lançamentos, desembarques, foguetes recuperados e especificações técnicas.
A página Human Spaceflight (humanSpace.html) aborda informações sobre voos espaciais tripulados. Ela fornece detalhes sobre as missões tripuladas realizadas pela SpaceX.
O site apresenta as seguintes funcionalidades e estilos principais:
- Navegação: O site possui um cabeçalho fixo com um menu de navegação que permite acessar as diferentes páginas.
- Design Responsivo: O site é responsivo e se adapta a diferentes tamanhos de tela.
- Animações: O site utiliza a biblioteca AOS (Animate On Scroll) para adicionar animações aos elementos à medida que a página é rolada.
- Seções de Conteúdo: Cada página é dividida em seções de conteúdo que fornecem informações sobre os diferentes tópicos.
- Rodapé: O site possui um rodapé com links para as redes sociais da SpaceX, políticas de privacidade e informações para fornecedores.
Para executar o projeto localmente, siga as etapas abaixo:
- Clone ou faça o download do repositório do projeto.
- Abra o arquivo index.html no seu navegador web.
- SpaceX: inspiração e fonte de conteúdo.
- Bootstrap: Usado para design responsivo e componentes pré-estilizados.
- AOS.js: Usado para animações de rolagem.
