diff --git a/group_vars/all/13_theming.yml b/group_vars/all/13_theming.yml index 11beafa1..3a4c9f81 100644 --- a/group_vars/all/13_theming.yml +++ b/group_vars/all/13_theming.yml @@ -5,8 +5,6 @@ global_theming: # General Colors base: "#001f3f" - lightness_change: - # Sucess Color success: "#B2D3B2" # As the warning color – a light brown (earth) @@ -15,4 +13,8 @@ global_theming: error: "#DC3545" # As the info color – a very light blue (symbolizing the sky) info: "#F0F8FF" + filters: + saturation_change: 100 + hue_shift: 0 + global_theming_enabled: true diff --git a/roles/nginx-global-css/templates/global.css.j2 b/roles/nginx-global-css/templates/global.css.j2 index 282766bb..8190087c 100644 --- a/roles/nginx-global-css/templates/global.css.j2 +++ b/roles/nginx-global-css/templates/global.css.j2 @@ -9,7 +9,7 @@ HINT: Better overwritte CSS variables instead of individual elements. :root { /** Derived Colors from the Base Color **/ {% for i in range(1, 100) %} - --color-{{ "%02d"|format(i) }}: {{ global_theming.css.colors.base | adjust_color(target_lightness=(i / 100)) }}; + --color-{{ "%02d"|format(i) }}: {{ global_theming.css.colors.base | adjust_color(target_lightness=(i / 100),saturation_change=global_theming.css.filters.saturation_change,hue_shift=global_theming.css.filters.hue_shift) }}; {% endfor %} /** Special Action Colors **/ @@ -24,7 +24,7 @@ HINT: Better overwritte CSS variables instead of individual elements. :root { /** Dark Mode Derived Colors from the Base Color **/ {% for i in range(1, 100) %} - --color-{{ "%02d"|format(i) }}: {{ global_theming.css.colors.base | adjust_color(target_lightness=(1 - (i / 100))) }}; + --color-{{ "%02d"|format(i) }}: {{ global_theming.css.colors.base | adjust_color(target_lightness=(1 - (i / 100)),saturation_change=global_theming.css.filters.saturation_change,hue_shift=global_theming.css.filters.hue_shift) }}; {% endfor %} /** Special Action Colors **/