Metronic 8.1.1 - Dark Mode Update
Hello!
We are using the Metronic theme for a project & would like to stay as updated as possible. Right now, we are using v8.0.38, & would like to update to v8.1.1. We don't need to dynamically change from light mode to dark mode, we just want dark mode.
Currently, we have a build script that pulls the dark mode stylesheets we need so we do not load the unused light mode styles.
Is there a way to still separate light mode & dark mode in v8.1? Or if we upgraded, would we be stuck loading a ton of the unused light styles?
Replies (5)
Yes, I understand that. But I don't want both the light & dark styles bundled into one css file. I would like them separated like it was before. Could we still do that for customers that don't want to have dynamic light/dark modes & instead want just one or the other?
Hi,
In Metronic 8.1 the dark mode is supported within the sase css file so no need to run a task to compile the dark mode. Instead you can run standard tasks to compile the theme assets and both dark and light modes will be available in the style bundle css file.
In your case, you just need enable the default theme mode to be dark:
<html theme-mode="dark">
</html>And remove the theme mode init code as you can see it here.
Regards.
Yes, I understand that. But I don't want both the light & dark styles bundled into one css file. I would like them separated like it was before. Could we still do that for customers that don't want to have dynamic light/dark modes & instead want just one or the other?
Hi,
Sorry, this is not possible since Bootstrap 5.3 will release a similar dark/light mode support. Having both dark/light in the CSS would not dramatically increase the CSS file size. It's a new approach for nowadays templates and Metronic adopted it. if you use the dark mode only, technically you will not lose anything.
Regards.
Hi Sean, just because someone else did something doesn't make it correct. We would really appreciate you guys reconsidering this approach as we don't want light mode support at all. Thats just extra cruft that weighs down each page request. Ideally we are including only what we need to keep everything fast and light.
