Get 2024 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $99
Get for 99$

Sidebar problem in VueJS(Safari browser)


Hello, encountered this problem on VueJS template theme, with Safari browser version 12 +. Personally we are testing on version 14

<a href="https://www.dropbox.com/s/kup5mfw3vuctr4m/Recording%20%23152.mp4?dl=0>Video</a>


Text formatting options
Submit

Replies (10)


Hi Slavn,

Thank you for reaching out to us.

Could you please specify which Metronic version and which demo you are using?

Regards,
Lauris Stepanovs,
Keenthemes Support Team



Hi Lauris,

Matronic 8/ Metronic Original(demo)



Hi Slavn,

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

Do you have the same problem on our preview page?
https://preview.keenthemes.com/metronic8/vue/demo1/#/

Regards,
Lauris Stepanovs,
Keenthemes Support Team



Video

https://www.dropbox.com/s/kup5mfw3vuctr4m/Recording%20%23152.mp4?dl=0

This error is still present, I'm trying to add a dropbox link so you can see this moment

Hi Slavn,

This issue is already fixed in the latest version. You can refer to src/layouts/main-layout/sidebar/SidebarLogo.vue in the latest version.

Using the code below you can hide the sidebar.

onMounted(() => {
setTimeout(() => {
const toggleObj = ToggleComponent.getInstance(
toggleRef.value!
) as ToggleComponent | null;

if (toggleObj === null) {
return;
}

// Add a class to prevent sidebar hover effect after toggle click
toggleObj.on("kt.toggle.change", function () {
// Set animation state
props.sidebarRef?.classList.add("animating");

// Wait till animation finishes
setTimeout(function () {
// Remove animation state
props.sidebarRef?.classList.remove("animating");
}, 300);
});
}, 1);
});


Regards,
Lauris Stepanovs,
Keenthemes Support Team



Hi Lauris,

https://preview.keenthemes.com/metronic8/vue/demo1/#/

You have the same bug that I described to you (shown in the video). The code you sent does not solve this problem.



Hi Slavn,

The only issue I see on your video is that sidebar doesn't get hidden when you press the toggle button, this happens because of the hover effect of the sidebar, and it is already be fixed in the latest version.

Is there any other issue? Could you please point me to the issue?

Regards,
Lauris Stepanovs,
Keenthemes Support Team



https://preview.keenthemes.com/metronic8/vue/demo1/#/ - is this link the latest version?



https://keenthemes.com/metronic

https://preview.keenthemes.com/metronic8/vue/demo1/?_ga=2.188017320.164850209.1681455191-1110255391.1676642432#/dashboard

is this the latest version?



Hi Slavn,

https://preview.keenthemes.com/metronic8/vue/demo1/?_ga=2.188017320.164850209.1681455191-1110255391.1676642432#/dashboard - This is a link to the latest Metronic preview page

Regards,
Lauris Stepanovs,
Keenthemes Support Team


Text formatting options
Submit
Text formatting options
Submit