Modo oscuro con Tailwind CSS 🌚

[jamerrq]

Vale, este es el resultado hasta ahora teniendo en cuenta las indicaciones:

• [X] Utilizar TailwindCSS + JS únicamente. (No libs).
• [X] Animación y transición correcta y correspondiente.
• [X] Utilizar las clases adecuadas del archivo: https://github.com/linuxmobile/midu.dev/blob/175d4dc6b937bcee9a7c3077dd9143420b2d58e3/tailwind.config.cjs#L12-L24

• Página de inicio

• Agenda

• Articulos

• Página articulo

Sé que no está el trabajo 100% terminado y en lo personal me veo con algunas observaciones para seguir trabajando en caso tal que son:

• Para el logo del header, usé el mismo truco que menciona Miguel Ángel en este video (min 6:50), pero no sé si es la forma más óptima de hacerlo

<img src="http://img.youtube.com/vi/1Xaqz3tGt88/0.jpg" alt="Modo oscuro con Tailwind CSS 🌚" />

• Me parece que hay un pequeño bug con el botón de cambio de tema, si bien funciona perfectamente, he visto que en ocasiones toca hacerle doble click para que pueda hacer su funcionalidad, hasta ahora no he podido encontrar la causa

• La paleta para el color claro la tomé a criterio propio, pero no me siento diseñador ni algo relacionado así que a lo mejor toca ajustar los colores :)

Es todo por el momento, quedo abierto a quejas, reclamos y/o sugerencias :)

Documentación

• Tailwind CSS Dark Mode - Flowbite
• Modo oscuro con Tailwind CSS 🌚
• Dark Mode Tailwind

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
midu-dev	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Oct 8, 2023 4:12pm

[jamerrq]

He arreglado un pequeño bug que prevenía de precargar el tema oscuro por defecto