Get 2024 Templates Mega Bundle!14 Bootstrap, Vue & React Templates + 3 Vector Sets
Get for 99$

Issues with UI Elements on Metronic Angular Demo Site


Hello team, I have noticed in these past few days the UI on your Medtronic angular demo site is breaking, the navigation bar is being blended with the background while scrolling, and the models of Filter, Create, and Edit are not showing. Can you help us out with this?

here is the screenshot: https://snipboard.io/UXzkCI.jpg


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 (7)


Hello, We are waiting for your valuable response as we know that support response within one day but we haven't receive a response form your side still!



Hi Muhammad Waseem

We apologize for the delay in our response. Our team is currently working on fixing the UI issues you have reported on the Metronic Angular demo site. We will include the fix in an upcoming update.

In the meantime, if a workaround is available, we will provide it to you as soon as possible.

Thank you for your patience and understanding.



Could you please provide a timeline for the workaround? Our project is currently facing critical challenges due to this issue, and resolving it promptly is crucial for us. We appreciate your understanding and look forward to receiving the necessary information as soon as possible.



Hi Muhammad Waseem,

We will check this issue as soon as possible and provide you with a workaround before the next updates. Thank you for your understanding.



Faizal Please let me know if you found anything because we are stuck on this point and we need your help regarding this!



Hi Muhammad Waseem,

Sorry for the delay in response. To address the issues you're experiencing, you can try the following:

Add the following code to the file /src/app/_metronic/layout/components/toolbar/toolbar.component.ts at the bottom of the updateProps function:

document.body.setAttribute("data-kt-app-header-minimize", "on");



adding this code to the file /src/app/_metronic/layout/components/toolbar/toolbar.component.ts at the bottom of the updateProps function , is creating this issue whereas if i remove this code the issue is resolved, plus the icons are also not showing even if I am running the project locally and also you can check on live site i.e https://preview.keenthemes.com/metronic8/angular/demo1/crafted/widgets/statistics

Screenshot for Reference:
1) https://paste.pics/9494a83696bd0af41a05b5b138d34e7c
2) https://paste.pics/8bc32dab4faaefc9ee5d4bf4d1177b40
3) https://paste.pics/6f04a6c85efc8621f3a82a6ceff70912
4) https://paste.pics/7e39c8ab37029d05c3e7ec38774ebd46

please review and let me know if you understand my problem


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  :(