How to use SASS variables in new primevue API configuration for a customized theme?

[anca987]

Hi there,

I'm migrating to primevue 4 in a project where I have a customized theme with sass, I looked over how I should style my components, that's pretty clear, what I'm not sure how to do is how should I reference a sass variable into my custom theme configuration? 😕
It works if I reference a CSS variable without no problems, though...
Can you please help?

[j0rgedev]

Hello @anca987. You could check Sakai Vue Template. They use scss files as the core styles. According to your question, you may also check the variables folder

[anca987]

Hello @j0rgedev,

Thank you for responding to me, I was looking for an example where definePreset utility is used, so that when I'm "styling" the Button component through API, I can write something like this in my Typescript file:
background: "$my-custom-primary-color".
It worked when I wrote it like background: "var(--my-custom-primary-color)".