Tema oscuro para el blog
Publicado el 18 de marzo de 2021
He leído opiniones que dicen que no hay evidencia científica que usar un tema oscuro sea mejor para leer o que esté reduce el cansancio de ojos. Tal vez, no sea cierto pero ya usar un tema claro me encandila. Por lo que decidí que ya era momento que el blog también tuviera un tema oscuro. Espero que les guste.
Now, I briefly explain how I implement it:
Tailwind CSS, en su documentación, comparte una porción de código en cómo implementarlo manualmente:
if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
document.documentElement.classList.add('dark')
} else {
document.documentElement.classList.remove('dark')
}Con esto, cuando se selecciona el tema oscuro, se agrega automáticamente la clase dark al elemento raíz html:
<html class="dark">Si no, la quita en caso de existir:
<html class>Ya con eso, es sólo usar la clase dark en los estilos.
Si quieres apoyar el blog y los experimentos, puedes hacerlo por PayPal o Buy me a coffee. ¡Agradezco su apoyo! :-)
