Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now

Issue with UI, not working properly


I'm reaching out regarding some UI rendering issues I've been experiencing with the Metronic Vue.js package in our application.

We've noticed that the UI behaves inconsistently, particularly when accessing the application for the first time or accessing the application in incognito or guest mode. The issues range from header shrinking unexpectedly to the header and page body appearing side by side instead of stacked as intended.
We've taken several troubleshooting steps, including clearing the browser cache, checking browser settings, and inspecting the console for errors. However, the problem persists.

Here are some additional details:
- Version of the Metronic Vue.js package : Template is demo1.
ref:https://preview.keenthemes.com/metronic8/vue/demo1/dashboard
- Version of Vue.js : @vue/cli 5.0.8
We've tested the application on multiple browsers, and the issue seems to be more prevalent in incognito or guest mode or first time.
There are no custom modifications to the Metronic Vue.js package that would likely cause these issues.

This is how it looks in normal tab:



Versus how to looks in incognito or guest mode or to someone accessing it for the first time:




We're seeking assistance from the community to understand if anyone else has encountered similar problems and if there are any known solutions or workarounds.
Any insights or guidance you can provide would be greatly appreciated.


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (2)


I have tried replacing metronics header in place of our header. It is working fine in normal tab but it is giving blank page in guest tab or incognito mode.



Hi,

Thank you for reaching out to us.

Unfortunately, we were not able to reproduce this problem in the latest Metronic version.

Do you have this problem in our preview page?
https://preview.keenthemes.com/metronic8/vue/demo1/

Your problem might be related to our initialization file src/core/services/LayoutService.ts, please make sure that the layout was initialized correctly and body tag has all the needed classes and attributes.

Regards,
Lauris Stepanovs,
Keenthemes Support Team


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(