Galería sencilla maquetada con HTML y estilizada con CSS Grid, con lightbox usando módulo de Bootstrap. El proyecto 25 del reto personal #100sitioswebchallenge
Puedes visualizar el sitio en: Grid Gallery Landscape
DESAFÍOS
Quise seguir trabajando con CSS Grid, y en esta ocasión usar una galería com lightbox. Y para esto recurrí al uso de bootstrap para que fuera más rápido y sencillo. Ve cómo a través del proyecto presento los módulos de bootstrap para hacer el efecto deseado. Para este ejemplo en específico pude usar flex, pero quise aplicar grid.
PROCESO
Mockup (Bosquejo)
Este es el mockups general del proyecto
HTML y CSS
Este es el proceso del sitio, primero maquetándolo en HTML y posteriormente trabajando los estilos incluyendo Bootstrap.
Sitio web responsivo
Este es la vista del sitio de manera responsiva
Publicación del sitio
Consulta el código del sitio en Github
Puedes visualizar el sitio en: Grid Gallery Landscape
Información técnica
- Visual Studio Code
- HTML5 (Semántico)
- CSS (Grdid)
- Bootstrap
- Sitio responsivo
- Github
- Netlify
Recursos
Unsplash
- Bailey Zindel
- Pietro De Grandi
- Pine Watt
- Mark Harpur
- Ales Krivec
- Daniela Cuevas
- Vicentiu Solomon
- Ryan Schroeder
- Claudio Testa
- Kristopher Roller
- Jeremy Bishop
- Marcelo Quinan
Deja tus comentarios y sugerencias.