📌 YoungRift

Projeto desenvolvido com o objetivo de praticar e aplicar diversos recursos de HTML, CSS, JavaScript, jQuery e Bootstrap, criando um portal completo de notícias sobre o jogo Wild Rift.

O site simula um portal informativo com múltiplas páginas interligadas e estruturadas com layout consistente. Conta com funcionalidades comuns em projetos profissionais como:

• Menu hamburger com sidebar de navegação.
• Tema claro/escuro selecionável pelo usuário.
• Simulação de perfil no topo (avatar + nome fictício).
• Animações com zoom nos cards de notícias.
• Toasts divertidos no final da rolagem sugerindo outras páginas.
• Modais para exibição de imagens maiores de skins.
• Página com minigame interativo onde o usuário monta sua pool de campeões.

🔧 Tecnologias utilizadas

• HTML

• CSS

• JavaScript

• jQuery

• Bootstrap

  Recursos do Bootstrap utilizados:

  • Navbar e sidebar
  • Cards
  • Carrossel (slide)
  • Modais
  • Toasts
  • Alerts
  • Grid com col- para responsividade

🚀 Status

Em produção

🔗 Deploy

young-rift.vercel.app

📚 Base do projeto

Projeto autoral criado para prática individual com base no universo do Wild Rift.

---

🌐 Demonstração

🔗 Acesse o site aqui
📁 Repositório no GitHub

---

⚙️ Como Rodar o Projeto

Clone o repositório:

git clone https://github.com/Mateus-Cimini/YoungRift.git

Abra o arquivo index.html no navegador ou use um servidor local com:

npx live-server

---

🛠 Funcionalidades

• ✅ Slide automático com as últimas novidades
• ✅ Notícias destacadas com capa, título, data, tag e descrição
• ✅ Sidebar com links para todas as páginas
• ✅ Cards clicáveis de skins com modais exibindo imagem maior
• ✅ Efeito zoom ao passar o mouse nas notícias
• ✅ Tema claro/escuro personalizável
• ✅ Toast no final da página sugerindo links
• ✅ Simulação de perfil (avatar e nick fictício)
• ✅ Minigame interativo para montar pool de campeões
• ⏳ Sistema de login e exibição de notícia completa ainda não implementados

---

🧩 Estrutura do Projeto

📁 assets/
   ├── 📁 css/
   └── 📁 images/
📁 libs/
   └── arquivos do Bootstrap (CSS e JS)
📁 pages/
   ├── 📁 eventos/
   │    └── eventos.html
   ├── 📁 jogo/
   │    ├── index.html
   │    ├── main.js
   │    ├── 📁 css/
   │    └── 📁 imgs/
   ├── 📁 Path Notes/
   │    ├── path.css
   │    ├── path.html
   │    └── path.js
   └── 📁 Novas skin/
        ├── skin.css
        ├── skin.html
index.html
script.js
README.md

---

🤝 Contribuindo

1. Faça um fork
2. Crie uma branch: git checkout -b minha-feature
3. Commit: git commit -m 'Minha contribuição'
4. Push: git push origin minha-feature
5. Crie um Pull Request

---

📄 Licença

Este projeto está sob a licença MIT.

---

👤 Autor

Feito por Mateus Cimini