Is there a missing CSS rule in the downloadable package
I downloaded the metronic 9 package after purchasing and implemented a theme toggle button in the demo site as referenced in this documentation https://keenthemes.com/metronic/tailwind/docs/components/theme . The button would disappear and upon investigation the css provided seems to lack the rule
.dark\:flex:is(.dark *) {
display:flex
}
that is hosted in the styles.css used in the documentation site. This is concerning as there seem to be other discrepancies as well, the prior rule is block in the public and inline block in the downloaded copy. What should I do to ensure I have the correct version with all the correct source so I don't have to debug things like this?
From public docs:
.dark\:block:is(.dark *) {
display:block
}
.dark\:flex:is(.dark *) {
display:flex
}
.dark\:hidden:is(.dark *) {
display:none
}
From provided download at themeforest:
.dark\:block:is(.dark *) {
display: block;
}
.dark\:inline-block:is(.dark *) {
display: inline-block;
}
.dark\:hidden:is(.dark *) {
display: none;
}
Replies (4)
Ensure you have the latest version – Check if there's an updated version of Metronic 9 available for download from ThemeForest. Sometimes, updates roll out separately from initial purchases.
Compare the Tailwind configuration – The missing .dark:flex:is(.dark *) rule suggests that the Tailwind configuration used in the downloadable package might differ from the one in the documentation. Verify if variants for dark mode are properly configured in your Tailwind settings.
Manually add the missing styles – If the documentation version includes the correct styles, you can manually add .dark\:flex:is(.dark *) { display: flex; } to your styles.css to restore the intended behavior.
Reach out to Keenthemes Support – If discrepancies persist, it's best to contact Keenthemes directly through their official support channels or forums. They may provide a patch or confirm if this is an intended difference.
Edited by paper io 1h ago
Hi,
Please note that when u add a new class into your HTML you will need to recompile your CSS as Tailwind uses actual classes in the css bundle:
https://keenthemes.com/metronic/tailwind/docs/getting-started/installation
Regards,
Sean
I have done that, but I have not added any CSS these are discrepancies between the provided CSS from themeforest that has been compiled and the CSS available to be viewed on the demo and example documentation pages.
I have corrected this issue by adding this rule and compiling it, but I am concerned about more missing CSS rules.
Hi,
Please note that the CSS will contain the code that used by your HTML. This is how Tailwind works. Tailwind compiles all the CSS classes that actually used in your pages. After any copy paste from doc you will need to recompile your CSS.
Regards,
Sean
