Bill
(Bill)
3 October 2024 21:16
1
I’m trying to set background color & opacity. I have the values like this in the template:
bg-[{{solidbg}}]/{{solidbgtrans}}
which is exporting as:
bg-[text-blue-500]/1
I can’t figure out why text-blue-500 isn’t showing up?
I just Updated the above code !
dan
(Dan C.)
3 October 2024 21:41
2
It looks like you have formatters setup in your properties file for both controls, remove them to get the raw values. You don’t need to use the hooks.
If your UI controls/properties are setup correctly, your output should look like this.
bg-blue-500 bg-opacity-80
You only need to use square brackets if you are using an arbitrary value, like this:
bg-opacity-[.23]
or this: bg-opacity-[23%]
It’s worth checking the tailwind docs if you get stuck on what classes to use (or ask ChatGPT). Opacity - Tailwind CSS
Hope that all makes sense, and feel free to post your properties JSON for these two controls and I can fix it up for you.
dan
(Dan C.)
3 October 2024 21:44
3
Ah I see you’ve updated your original message… still looks like your formatter in the properties is setup incorrectly.
Your output should look like this…
bg-blue-500/[100%]
Bill
(Bill)
3 October 2024 21:50
4
Yup, it was the formatters that was messing things up - btw: bg-opacity-[*] isn’t even in the tailwind docs, maybe that’s your guys custom class, but anyway it’s working now - thanks - I’ll learn this stuff eventually
dan
(Dan C.)
3 October 2024 22:16
5
Glad it’s working for you now We don’t have any custom classes, it’s 100% Tailwind