Custom CSS variable prefix not supported?

[geiregjo]

We are using a custom CSS variable prefix in our project. This conflicts with the hardcoded "p" prefix in this project. Are there plans to resolve this issue?

[cjb-g]

Did you try changing the prefix option in your main.js ?

https://primevue.org/theming/styled/#theme

import PrimeVue from 'primevue/config';
import Aura from '@primevue/themes/aura';

const app = createApp(App);

app.use(PrimeVue, {
    // Default theme configuration
    theme: {
        preset: Aura,
        options: {
            prefix: 'p',
            darkModeSelector: 'system',
            cssLayer: false
        }
    }
 });

[geiregjo]

I did, it's set to "prls". But this does not reflect in the Tailwind CSS output. Instead I get:

.text-primary-500 {
  --tw-text-opacity: 1;
  color: color-mix(in srgb, var(--p-primary-500) calc(100% * var(--tw-text-opacity)), transparent);
}

[valante]

Confirming this issue. Please fix.

[LarsKeulen]

Confirming this issue is still present in Jan 2025.

[joshuagauci]

any updates on this fix ? this issue is still present.

[codehunter13]

Stil not fixed?

[Nightcro]

The issue still exists

[void0-0]

This issue persists to this day