Proyecto realizado como parte del Desafío 3 - Media Query.
El objetivo es practicar CSS Grid, Flexbox y Media Queries para construir un layout responsive.
-
2 Layouts (Mobile y Desktop)
- Mobile: menú superior con ícono hamburguesa y productos en 1 columna.
- Desktop (>=576px): menú lateral con logo, productos en 4 columnas.
-
Uso de CSS Grid
grid-template-areas
define la disposición de las 4 secciones en mobile y desktop.
-
Uso de Flexbox
- Distribución interna en el menú, filtros y footer.
-
4 Secciones principales
- Menú de navegación
- Filtros de búsqueda
- Sección principal de productos
- Pie de página
- HTML5
- CSS3 (Grid, Flexbox, Media Queries)
- Font Awesome (para íconos)
- Mobile: productos en una sola columna con menú hamburguesa.
- Desktop: menú lateral fijo con logo, productos en grilla de 4 columnas.