search

SolidZORO / next-plugin-antd-less

🎩 Use Antd (Less) with Next.js v12, Zero Dependency on other Next-Plugins.
MIT License
345 stars 48 forks source link

How to enable the dark mode? #80

Closed THPubs closed 2 years ago

THPubs commented 2 years ago

Hi, I tried adding the following to modifyVars but it still didn't work. Any idea what's happening?

'@THEME--DARK': 'theme-dark',
dark: true
SolidZORO commented 2 years ago

😂 All this code needs to be written by you, the plugin does not provide dark mode.

THPubs commented 2 years ago

@SolidZORO But Antd does have an official dark mode theme (). I'm trying to enable that. Once it got loaded but with a reload it went back to the default theme.

THPubs commented 2 years ago

@SolidZORO Found out how to do it!

const { getThemeVariables } = require('antd/dist/theme');

...

  modifyVars: {
    ...getThemeVariables({
      dark: true, // Enable dark mode
    }),
    '@primary-color': '#ffffff',
  },
  javascriptEnabled: true,

You have to wrap the config with getThemeVariables and set javascriptEnabled to true.