vue-tailwind-datepicker icon indicating copy to clipboard operation
vue-tailwind-datepicker copied to clipboard

Dark mode doesn't work in nuxt3

Open henrywu-new opened this issue 1 year ago • 3 comments

1. tailwind.config.ts :

module.exports = { darkMode: 'class', // ... }

  1. gobal class:

html.dark { color-scheme: dark; }

henrywu-new avatar Apr 27 '23 11:04 henrywu-new

See Theming options

in tailwind.config.ts:

export default {
  darkMode: 'class',
  theme: {
    extend: {
      colors: {
        'vtd-primary': colors.sky, // Light mode Datepicker color
        'vtd-secondary': colors.gray, // Dark mode Datepicker color
      },
    },
  }
}

wfm

roiLeo avatar Sep 20 '23 14:09 roiLeo

@henrywu-new Does it work for you?

elreco avatar Nov 16 '23 09:11 elreco

Hey @elreco this thread is not mine but I have a question. I was trying to make the light mode work, cause by default it showed up dark... After a little bit of trial and error I added to tailwind.config.js the following:

darkMode: "class",

And it worked! Now I have it light as I needed. But it doesn't make sense to me. Can you explain or tell me how/if it's possible to change the theme programatically from a vue component?

Thanks in advance!

escalante29 avatar Feb 06 '24 00:02 escalante29