How to use CSS Vars?

LeandroTeixeira

Hello, i am using .CSS file in my project, and now i want to use CCS Vars. I already tried:
Test 1:
@const THEME_DARK_COLOR: #00FFAA
QLabel#Lbl1 {
color: @THEME_DARK_COLOR;
}
Result: Nothing.

Test2:
:root{
-THEME-DARK-COLOR: #00FFAA;
}
QLabel#Lbl1 {
color: var(-THEME-DARK-COLOR);
}

Result: The label does not appear.

Test 3:
:root{
--THEME-DARK-COLOR: #00FFAA;
}
QLabel#Lbl1 {
color: var(--THEME-DARK-COLOR);
}

Result: Error on apply the style.css.

So my question is, how is the right method to use variables on CSS ?
Thanks a lot.

JKSH

@LeandroTeixeira said in How to use CSS Vars?:

how is the right method to use variables on CSS ?

Widget stylesheets only support CSS 2.1. Unfortunately, CSS variables (custom properties) were introduced in CSS 3.

JonB

@LeandroTeixeira said in How to use CSS Vars?:

So my question is, how is the right method to use variables on CSS ?

There isn't such a facility in CSS 2.1. It has always been an irritatingly-missing feature, it's interesting to see @JKSH says it has been introduced in CSS 3 (though no use for Qt).

The usual way to implement this in Qt is to pre-process the CSS (e.g. read from an external) file before applying it in your application. Put things in you can recognise and do necessary replacements.

LeandroTeixeira

Thanks for the fast response. I will go on with my style.css without using variables.