Apply glassmorphism to ConfirmDialog overlay and surface

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-09 19:00:39 +01:00
parent 831ffc071a
commit e6c4a21f65

View File

@@ -75,7 +75,7 @@ watch(
.confirm-dialog__overlay {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.4);
background: var(--color-glass-overlay);
display: flex;
align-items: center;
justify-content: center;
@@ -84,9 +84,12 @@ watch(
}
.confirm-dialog {
background: var(--color-card);
background: linear-gradient(135deg, var(--color-glass-strong) 0%, var(--color-glass-subtle) 100%);
border: 1px solid var(--color-glass-border);
backdrop-filter: blur(24px);
-webkit-backdrop-filter: blur(24px);
border-radius: var(--radius-card);
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
padding: var(--spacing-xl);
max-width: 320px;
width: 100%;
@@ -98,13 +101,13 @@ watch(
.confirm-dialog__title {
font-size: 1.05rem;
font-weight: 700;
color: var(--color-text);
color: var(--color-text-on-gradient);
}
.confirm-dialog__message {
font-size: 0.9rem;
font-weight: 400;
color: #666;
color: var(--color-text-soft);
}
.confirm-dialog__actions {
@@ -130,8 +133,9 @@ watch(
}
.confirm-dialog__btn--cancel {
background: #e8e8e8;
color: #555;
background: var(--color-glass);
border: 1px solid var(--color-glass-border);
color: var(--color-text-on-gradient);
}
.confirm-dialog__btn--confirm {