Grids Avanzadas - Framework Knockout

Cuando creamos Knockout, era importante tener en cuenta la adaptabilidad. Habíamos explorado frameworks que eran más rígidos y los encontramos poco prácticos para el trabajo que hacemos. Así que sentimos que era importante permitir que Knockout se ajustara a un proyecto determinado.

La mayoría de nuestros proyectos requieren outer gutters, por lo que optamos por un grid de 14 columnas por defecto. (12 columnas para el contenido, y una gutter de 1 columna de cada lado). Pero hay ocasiones en las que podríamos necesitar un grid de 12 columnas full width, o en las que podríamos necesitar 12 columnas para el contenido, pero solo gutter de media columna. Este tipo de ajustes son fáciles de realizar en un entorno de desarrollo tradicional, pero en Webflow requiere un poco más de trabajo.

Lo que es clave para comprender es que las columnas, el padding y los margins en Knockout son, de forma predeterminada, relativos al grid de 14 columnas. Entonces, una columna horizontal es 1/14 de la pantalla, o 7.143 unidades VW. Y Margin Bottom - M es también una sola columna de vertical spacing, 7.143 unidades VW. Si quisiéramos cambiar el grid a un grid de 12 columnas de full width, todas las matemáticas necesitarían actualizarse para basarse en anchos de columna de 8.333 unidades VW. (Y 13 Col , 14 Col , 13 Col Tab , 14 Col Tab , 13 Col Mob y 14 Col Mob tendrían que eliminarse).

Para gutter de media columna, la matemática tendría que ser divisibles por 13, y luego cada página necesitaría 3.846 unidades VW de padding en cada lado (1/26 del viewport).