Una interfaz cartográfica con flexbox y CSS grid

16 de Mayo de 2018

Recientemente he tenido que diseñar una interfaz cartográfica que use en diferentes proyectos. Como cada proyecto tenía diferentes requisitos pude experimentar flexbox y CSS grid. CSS grid es una verdadera revolución y facilita muchooo el diseño.
Creo que fue la primera vez que me gustó escribir más de 3 lineas de CSS... Y para compartir esa experiencia he creado un repo github que contiene una interfaz mínima con dos demos, una con flexbox y otra con CSS grid.

La interfaz contiene un header, una barra de herramientas, un mapa (con Leaflet) y un footer.


La demo de la versión con flexbox es aquí. Con CSS grid, acá. Visualmente el resultado es exactamente el mismo. Los íconos son únicamente para llenar la interfaz. No pasa nada cuando se hace clic sobre ellos.
Tal vez agregaré más componentes en el futuro.

Twittear