torsten/yourpart3
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

style(DialogWidget): update dialog overlay class for improved modal handling

Browse Source 
- Changed the class binding for the dialog overlay to differentiate between modal and non-modal states, enhancing visual clarity.
- Introduced a new class for non-modal dialogs to ensure proper positioning and z-index management.
This commit is contained in:
Torsten Schulz (local)
2026-03-27 15:21:57 +01:00
parent 31a96aaf60
commit 6cbcf9d95f
1 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
frontend/src/components/DialogWidget.vue
View File

@@ -1,5 +1,5 @@
<template> <template>
<div v-if="visible" :class="['dialog-overlay', { 'non-modal': !modal, 'is-active': isActive }]" <div v-if="visible" :class="[modal ? 'dialog-overlay' : 'dialog-layer', { 'is-active': isActive }]"
@click.self="handleOverlayClick"> @click.self="handleOverlayClick">
<div class="dialog" :class="{ minimized: minimized }" <div class="dialog" :class="{ minimized: minimized }"
:style="{ width: dialogWidth, height: dialogHeight, top: dialogTop, left: dialogLeft, position: 'absolute' }" :style="{ width: dialogWidth, height: dialogHeight, top: dialogTop, left: dialogLeft, position: 'absolute' }"
@@ -193,9 +193,10 @@ export default {
backdrop-filter: blur(10px); backdrop-filter: blur(10px);
} }
.dialog-overlay.non-modal { .dialog-layer {
background: transparent; position: fixed;
backdrop-filter: none; inset: 0;
z-index: 1000;
pointer-events: none; pointer-events: none;
} }