El preprocesador de CSS Sass facilita la incorporación de lógica de programación en las hojas de estilo, a través de variables y funciones que reducen la repetición de código.
Para más información sobre el funcionamiento y configuración de Sass, consulta la documentación oficial.
Los archivos principales que generan cada uno una hoja de estilos con gef.scss y gef-campus.scss, que importan a su vez todos los archivos de Sass necesarios.
Los archivos _variables.scss y _mixins.scss importan las variables en las carpetas /variables/ y /mixins/ respectivamente.
El archivo _gef-sass.scss es un archivo Sass con una serie de variables y mixins que el desarrollador frontend puede descargar como zip en la sección de Sass.
Los nuevos archivos de Sass, sean componentes o variables, deben llamarse desde los archivos principales (gef.scss y _gef-campus.scss para los componentes, _variables.scss para las variables, _mixins.scss para los mixins).
Variables generales (tipografía, espaciados, colores…) y de cada módulo de los que componen los elementos de interfaz de GEF. Las variables propias de Campus se encuentran en la subcarpeta /campus/.
Mixins o funciones reutilizables de Sass, como los de media queries y retícula, generación de botones o pestañas.
Incluye los estilos de CSS más elementales, como reset, helpers y retícula.
Contiene los distintos módulos de interfaz que componen la guía de estilo.
Incluye la hoja de estilo de iconos, generada automáticamente desde Grunt, y no se debe editar.