theme.yml

Uso de la rama theme y estilos de bootstrap

Escrito por~

  • al clonar un proyecto, empezar una rama

    theme

  • en esta rama siempre van los cambios realizados a

    _data/theme.yml
    ,
    assets/css/styles.scss
    y
    _sass/
    . o sea, todo lo que sea estilos (la idea es no generar conflictos)

  • al analizar el diseño, se dan de alta colores (

    $colors
    ), relaciones de aspecto (
    embed_responsive_aspect_ratios
    ), tamaños de margen/espaciado (
    $spacers
    ), todo lo que salga del diseño y sea reutilizable

  • si al trabajar con un componente necesitamos redefinir una variable que venga de bootstrap (

    node_modules/bootstrap/scss/_variables.scss
    ) se trae a este archivo reemplazando guion medio con bajo (o sea pasar de kebab-case a snake_case)

  • en cada rama de issue mergearse

    theme
    (alternativa: hacer el cambio en la rama del issue y hacer cherry pick en la rama de
    theme
    para que todes tengamos el mismo cambio)

Bootstrap automáticamente levanta estas variables

Hay otras variables que no se cambian acá sino que se cambian en

_data/layouts/theme.yml
(tipografía, color principal, color secundario, etc) creando un post desde el panel. Estas son las variables que son personalizables por les usuaries.

Documentar es un acto de amor, siempre es para otre.

Hecho por Sutty.