CSS Settings

Base

Estilos directos a etiquetas html.

Forms

Estilos directos a etiquetas html de formulario.

Grid

Grilla creada para alinear elementos en el layout.

  • .container :
  • Espacio seguro donde se situa los elementos de la pagina

    Elementos:

    • .row :

      Caja que separa una bateria de elementos alineados verticalmente de otros. Los .row se alinean uno debajo de otro siempre dentro de un .container.

    • .row--reverse :

      Alinea los elementos de invirtiendo el orden de posicion de caja ahora de izquierda a derecha.

    • .col-xl-(1~12), .col-l-(1~12), .col-m-(1~12), .col-s-(1~12) :

      Columnas del row, donde S <= $small-viewport, M <= $medium-viewport, l <= $large-medium, xl > $large-medium

    Modificadores:

    • .container--fluid :

      El espacio de trabajo ocupa el 100% del ancho del viewport.

    • .container--medium :

      Espacio de trabajo mas estrecho, definido en $container-medium-width.

    • .container--small :

      Espacio de trabajo mas estrecho, definido en $container-small-width.

Theme

Clases que se aplican al body directamente.

  • .body, .body--light , .body--solid-color :
  • Situa el color del background y por defecto un alto del 100% el alto del viewport.

  • .lazyLoad :
  • Clase que se le agrega a las imagenes automaticamente por el plugin vue-lazy load.