fix fullscreen button: use x-show instead of x-if templates

x-if with template tags inside a button element causes scope issues.
Switch to x-show on SVG elements directly.
This commit is contained in:
Viktor Barzin 2026-03-23 00:42:10 +02:00
parent f8bbb2e993
commit aa6760cb0f
No known key found for this signature in database
GPG key ID: 0EB088298288D958

View file

@ -490,18 +490,14 @@
<!-- Fullscreen toggle button --> <!-- Fullscreen toggle button -->
<button class="fullscreen-toggle-btn" @click="toggleFullscreen()" :title="isFullscreen ? 'Exit fullscreen' : 'Fullscreen'"> <button class="fullscreen-toggle-btn" @click="toggleFullscreen()" :title="isFullscreen ? 'Exit fullscreen' : 'Fullscreen'">
<template x-if="!isFullscreen"> <svg x-show="!isFullscreen" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <polyline points="15 3 21 3 21 9"></polyline><polyline points="9 21 3 21 3 15"></polyline>
<polyline points="15 3 21 3 21 9"></polyline><polyline points="9 21 3 21 3 15"></polyline> <line x1="21" y1="3" x2="14" y2="10"></line><line x1="3" y1="21" x2="10" y2="14"></line>
<line x1="21" y1="3" x2="14" y2="10"></line><line x1="3" y1="21" x2="10" y2="14"></line> </svg>
</svg> <svg x-show="isFullscreen" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
</template> <polyline points="4 14 10 14 10 20"></polyline><polyline points="20 10 14 10 14 4"></polyline>
<template x-if="isFullscreen"> <line x1="14" y1="10" x2="21" y2="3"></line><line x1="3" y1="21" x2="10" y2="14"></line>
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> </svg>
<polyline points="4 14 10 14 10 20"></polyline><polyline points="20 10 14 10 14 4"></polyline>
<line x1="14" y1="10" x2="21" y2="3"></line><line x1="3" y1="21" x2="10" y2="14"></line>
</svg>
</template>
</button> </button>
<template x-if="selectedNode"> <template x-if="selectedNode">