Fast make grid

About this plugin

🎛️ Grid Generator

Grid Generator es una herramienta que diseñé para crear grillas dinámicas y bien estructuradas basadas en frameworks populares como Bootstrap y Foundation. Mi objetivo fue simplificar la configuración de columnas, breakpoints y márgenes para tus diseños, garantizando precisión y ahorrándote tiempo.

Ya sea que estés trabajando en un diseño responsive, configurando un sistema de diseño o ajustando márgenes precisos, Grid Generator te ofrece la flexibilidad que necesitas para que te concentres en lo importante: ¡diseñar! ✨

✅ Soporte para Frameworks Populares

Genera grillas ajustadas a los breakpoints de:

1. Bootstrap: Desde xs hasta xxl.
2. Foundation: Desde small hasta xlarge.

✅ Contenedores Dinámicos

Configura contenedores:

1. Fixed: Se ajusta al ancho del breakpoint seleccionado.
2. Fluid: Se adapta al ancho completo del frame.

✅ Márgenes Automáticos

Agrega márgenes externos dinámicos en contenedores Fixed, calculados según el framework seleccionado:

1. Bootstrap: 12px por lado.
2. Foundation: 16px por lado.

✅ Cálculo Preciso de Columnas

El plugin ajusta el tamaño de las columnas automáticamente según el ancho disponible, restando márgenes y gutters para garantizar una alineación perfecta.

¿Cómo usarlo?

1. Selecciona un Frame
2. Asegúrate de tener un frame seleccionado para aplicar la grilla.
3. Configura la Grilla
4. Escoge un framework (Bootstrap o Foundation).
5. Selecciona un breakpoint.
6. Define el tipo de contenedor (Fixed o Fluid).
7. Elige el número de columnas (4 o 12).
8. Haz clic en "Generar Grilla" para aplicar la configuración al frame.

Opcional: Agregar Márgenes

Si el contenedor es Fixed, usa el botón "Agregar Márgenes" para incluir márgenes externos a los extremos.

Si tienes consejos o mejoras me dejas un comentario!!!