nuxt-themes / alpine

The minimalist blog theme, powered by Nuxt & Markdown.
https://alpine.nuxt.space
MIT License
295 stars 55 forks source link

Support Dark Mode #8

Closed atinux closed 2 years ago

atinux commented 2 years ago

Example: https://github.com/Atinux/content-wind/blob/main/app.vue#L12-L14

Since we cannot have app.vue, you need to create a global CSS file: assets/css/main.css

And add it in the nuxt.config.ts:

export default defineNuxtConfig({
  css: ['~/assets/css/main.css']
})
atinux commented 2 years ago

Next in your component you can handle the dark mode using the dark: selector of Tailwind CSS.

atinux commented 2 years ago

Also, you need to set this in the nuxt.config.ts: https://github.com/Atinux/content-wind/blob/main/nuxt.config.ts#L11-L13