[feature] Enable CSS colors and SCSS variable in preset file

[jbonlinea]

Hi there

The preset file is great to set presets...
And the build in SCSS compiler is great to set variable for instance for theme colors that can then be used eveywhere and changed form one place

The sad part is that we can't use SCSS variable in presets settings, nor we can use CSS colors.

That's a pity since you have done all the hard work, and we yet have to use #colors in presets and change them manually if we edit our theme colors.

cheers

[mahagr]

Yes, they are only parsed as values. Allowing the use of variables is possible in the library, but it needs a deep integration with the library, which makes it complicated to add this feature -- especially as the library is changing the internals right now, to use a different internal format.

CSS colors may be easier to support, though, but even it would need changes in the color picker widget.

[mahagr]

Just an idea; you can kind of do this already. In CSS you can use css3 variables and then set them using variables in SCSS.

@hexplor This may be something worth to look in future themes as css3 variables are well supported (and in Joomla 4).

[jbonlinea]

Hi,

Ho smart :

Sorry I took a while to answer as I had to go ahead with this.

What you suggest works to a certain extend ; the "colouring" works, the field indeed get populated with the value var(--blue) and SCSS compile neatly.

However, in gantry ui, we can not edit and save the preset anymore, as the field populated with a ccs3 var contain an unexpected values, see capture.

But, there is a but, if one click on the color field containing the css3 var, then the field value is automatically populated with hex color value, and we may now save the preset from the ui.

So we are very close indeed

Regards

[mahagr]

Yes, in that case, it's the form field validation that fails.