Tamaños de pantalla

Medida	Desde	Hasta
XS	0px	400px
S	400px	770px
M	770px	1030px
L	1030px	N

Grilla de elmentos

Si bien la grilla la vamos a ver en apartados posteriores a este documento vamos a utilizarla como ejemplo para describir lo antes mencionado, invitamos al lector a achicar el tamaño de la vista del navegador para observar como se reacomodan los elementos.

Ejemplo Medidas

Si achica el tamaño de la pantalla va poder apreciar como se distribuyen los campos respetando las medidas explicadas en este apartado.

Codigo Css

    .div-ejemplo {
        padding: 20px;
        border-color: black;
        background-color: red;
    }

Modificación

Si lo desea pude alterar estos valores desde el archivo que se encuentra en sass/globales/_variables.scss

    // ************************************** //
    // *********** CONFIGURACIÃ“N ************ //
    // ************************************** //

    $tamaños:(
                xs: 400px,
                s: 770px,
                m: 1030px,
                l: 1200px, /// Mayor 
    );