search

primefaces / primevue

Next Generation Vue UI Component Library
https://primevue.org
MIT License
8.66k stars 1.09k forks source link

SelectionButton: Not following dark mode #5994

Open xarthurx opened 2 days ago

xarthurx commented 2 days ago

Describe the bug

Using the darkModeSelector to change color mode. SelectionButton is not following the logic:

Light/Dark Mode: image image

Reproducer

https://stackblitz.com/edit/primevue-nuxt-issue-template

PrimeVue version

4.0.0-beta.5

Vue version

3.x

Language

TypeScript

Build / Runtime

Vue CLI App

Browser(s)

Chrome

Steps to reproduce the behavior

Your stackblitz templete for nuxt is not working. But this bug should be very easy to test out.

Expected behavior

SelectionButton also follows the color logic.

mertsincan commented 2 days ago

Hi @xarthurx, unfortunately, I couldn't replicate this. Could you please create a runnable project for us to replicate? Also, could you please try it with latest PrimeVue version?

Best Regards,

github-actions[bot] commented 2 days ago

We're unable to replicate your issue, if you are able to create a reproducer or add details please edit this issue. This issue will be closed if no activities in 20 days.

xarthurx commented 1 day ago

Hi @xarthurx, unfortunately, I couldn't replicate this. Could you please create a runnable project for us to replicate? Also, could you please try it with latest PrimeVue version?

Best Regards,

I've never used stackblitz before. Could you fix your nuxt template so that I can directly copy code into it?

mertsincan commented 1 day ago

No problem, yes you can use our example to provide your test case.

xarthurx commented 1 day ago

No problem, yes you can use our example to provide your test case.

https://stackblitz.com/edit/primevue-nuxt-issue-template This is broken.

xarthurx commented 13 hours ago

No problem, yes you can use our example to provide your test case.

Could you fix your official template so that we can submit reproducible examples? All your template on stackblitz is not accessable.

xarthurx commented 12 hours ago

OK. I dig a bit into this problem, and it turns out the darkModeSelector is not working as expected.

As also asked here: https://github.com/primefaces/primevue/issues/5515

The documentation for how to apply dark mode is quite vague... Is the dark tag my-app-dark or dark or whatever is added to the html element or to each of PrimeVue's class? Is there any detailed explanation about how it works?

Is there a preset in any of the preset style (aura for instance) for dark mode, or we need to manually add the css for dark mode?