Update bugs (8.1.2) - React demo2

Hello,

Since the latest update (8.1.2) the fonts, header and background is looking strange on demo2. It is the same on the preview site: https://preview.keenthemes.com/metronic8/react/demo2

I would also like to use const {mode} = useThemeMode() hook on the AuthLayout to change the background based on theme mode but it is not updating.

Also when logging in with dark mode enabled, the menu shows Light mode is active.

Can you please let me know how to fix this issues asap?

Thanks

Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (8)

Hi,

Thank you for your message,
We will fix it during the next 2-3 days.
I will write an update here, on this ticket.

Regards,
Keenthemes support

Thanks. Looking forward to the update.

Pls, redownload demo2 and do the next steps:
1) demo2/src/_metronic/layout/components/header/Topbar.tsx:
Update row 14: toolbarButtonHeightClass = 'btn-active-light-primary btn-custom w-30px h-30px w-md-40px h-md-40p',
2) demo2/src/_metronic/partials/layout/header-menus/HeaderNotificationsMenu.tsx:
Update row 14: style={{backgroundImage: `url('${toAbsoluteUrl('/media/misc/menu-header-bg.jpg')}')`}}

3) demo2/src/_metronic/partials/layout/quick-links/QuicLinks.tsx:
Update row 13: style={{backgroundImage: `url('${toAbsoluteUrl('/media/misc/menu-header-bg.jpg')}')`}}
4) demo2/src/_metronic/partials/layout/theme-mode/ThemeModeProvider.tsx:
Uncomment row 67: themeModeSwitchHelper(_mode).

Regards,
Keenthemes support

Your Support Matters!

We will highly appreciate your Metronic Review on Themeforest.
Please go to Themeforest Downloads page, select Metronic & leave your feedback.

Hi Carmelo!

Thanks, I did all the steps but the issues I mentioned did not go away. You can simply check your production demo and see what all went wrong with the latest update.

1) The font styling is lost.

2) Please do the following: change from light to dark mode, log out, log in, and see the menu is showing Light is active. Then changing back to Light mode some components stay in dark mode. That is not right.

3) This could be related to 2). The const {mode} = useThemeMode() I would like to implement in AuthLayout component is simply not updating the value when I switch the mode. Only after refresh which is not desirable.

Could you please fix these so we have a working demo that we can build upon?

Thanks for your work!

Best wishes,
Tamás

Hi,

Could you please re-download the last version - you mentioned issue - was fixed in v8.1.3.

Regards,
Keenthemes support

Your Support Matters!

We will highly appreciate your Metronic Review on Themeforest.
Please go to Themeforest Downloads page, select Metronic & leave your feedback.

Hey Carmelo,

Thanks for your reply. This is awesome, the Theme Mode is now working correctly!

The last bug from this list is the Font style. For some reason it got lost with this update (8.1.2) and it's still the same in 8.1.3.

May I ask if this change from:

font-family: Poppins,Helvetica,"sans-serif";

to:

font-family: Inter, Helvetica, "sans-serif";

was intentional? If so, where can one adjust the basic font family types?

Thank you!

Hi,

Yes, we intentionally changed the font to Inter globally. This font is more smooth and easier for reading in terms of the theme design and UX.

Regards.

Great, thanks for letting me know.

Best wishes.

Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(