Invalid usages of liquid assigns in css-variables

[jonathanmoore]

Due to the nature of how the liquid is passed from snippets/css-variables.liquid to the theme's CSS file when Slate is deployed or built, the values of any variables created using assign are not carried over from the snippet to CSS asset.
https://github.com/Shopify/starter-theme/blob/master/src/snippets/css-variables.liquid#L5

<style>
{%- assign font_body_bold = settings.font_body | font_modify: 'weight', 'bolder' -%}

:root {
  --font-body-bold-weight: {{ font_body_bold.weight | default: 'bold' }};
}
</style>

When Slate is deployed or built the liquid tag {{ font_body_bold.weight | default: 'bold' }} is dropped into the layout.theme.css.liquid file. However since the variable assignment happens in a snippet outside of the style asset the value of font_body_bold.weight is null which always defaults to bold regardless of the font_modify filters.

Similar to Shopify/slate#503, currently there is not a workaround or way to apply any type of logic or assignment of variables with Liquid or even SCSS.