Este tutorial muestra cómo hacer un sencillo conmutador de tema oscuro/claro con Tailwind CSS. Está hecho en Vanilla JS con un solo archivo app.js.
Entonces, si quisiera implementar esto en un proyecto de Vue, ¿simplemente descargaría ese código en ~/src/main.js, o hay una mejor manera?
Una buena manera de implementar conmutadores de temas en Vue es mantener un valor en algún tipo de tienda como vuex o pinia .
Por ejemplo, podría agregar una variable isDarkMode (booleano) o pageTheme (cadena) y, según su valor, puede establecer una clase diferente en su cuerpo o componentes individuales, simplemente obteniendo el valor de la tienda. Luego, podría crear un conmutador de temas, que muta la variable del tema al hacer clic. ;)
Esta sería una opción para todo el proyecto, también con la posibilidad de cambiar partes específicas.