Último desafio do curso gratuito de Kevin Powell Conquering Responsive Layouts
- Página web responsiva feita através da abordagem Mobile-first
- Menu suspenso para aparelhos móveis
| Tela Desktop (1280px) | Tela iPad (768px) | Tela iPhone (375px) | Outros |
|---|---|---|---|
 |
 |
 |
 |
- URL para o Site: Github Pages
- Marcação semântica HTML
- Propriedades personalizadas CSS
- Flexbox
- Abordagem mobile-first
- Javascript puro
Essa foi a minha primeira vez fazendo um menu suspenso, então foi um desafio e tanto e emocionante até. Foi consideravelmente difícil, porém igualmente satisfatório vê-lo funcionando e, sinceramente, belamente animado, considerando que foi a minha primeira tentativa! 😁
Também aprendi como fazer efeito cascata (ripple effect) apenas usando HTML e CSS. Não é 100% funcional, caso usado com o mouse — pois é feito baseado no hover state — porém suficientemente funcional, em especial para dar uma sensação tátil à versão móvel.