Refine offline status toasts and theme styling

This commit is contained in:
jxxghp
2026-07-02 12:36:49 +08:00
parent af604d0c5c
commit d06ce5d984
4 changed files with 95 additions and 136 deletions

View File

@@ -847,8 +847,52 @@ html[data-theme="transparent"].transparent-glass-realtime .v-theme--transparent
}
.Vue-Toastification__toast {
--mp-toast-accent-rgb: var(--v-theme-primary);
border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
border-inline-start: 0.25rem solid rgba(var(--mp-toast-accent-rgb), 0.88);
border-radius: var(--app-overlay-radius);
background:
linear-gradient(
135deg,
rgba(var(--mp-toast-accent-rgb), 0.14),
rgba(var(--mp-toast-accent-rgb), 0.05) 42%,
rgba(var(--v-theme-surface), 0.96)
),
rgb(var(--v-theme-surface)) !important;
box-shadow: var(--app-overlay-shadow);
color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !important;
font-family: inherit;
}
.Vue-Toastification__toast--default,
.Vue-Toastification__toast--info {
--mp-toast-accent-rgb: var(--v-theme-info);
}
.Vue-Toastification__toast--success {
--mp-toast-accent-rgb: var(--v-theme-success);
}
.Vue-Toastification__toast--error {
--mp-toast-accent-rgb: var(--v-theme-error);
}
.Vue-Toastification__toast--warning {
--mp-toast-accent-rgb: var(--v-theme-warning);
}
.Vue-Toastification__icon,
.Vue-Toastification__close-button {
color: rgba(var(--mp-toast-accent-rgb), 0.95);
}
.Vue-Toastification__close-button {
opacity: 0.65;
}
.Vue-Toastification__progress-bar {
background-color: rgba(var(--mp-toast-accent-rgb), 0.35);
}
// 对话框样式

View File

@@ -221,6 +221,18 @@ html[data-theme="transparent"] {
backdrop-filter: blur(var(--transparent-blur));
background-color: rgba(var(--v-theme-surface), var(--transparent-opacity-heavy));
}
.Vue-Toastification__toast {
backdrop-filter: blur(var(--transparent-blur));
background:
linear-gradient(
135deg,
rgba(var(--mp-toast-accent-rgb), 0.16),
rgba(var(--mp-toast-accent-rgb), 0.06) 44%,
rgba(var(--v-theme-surface), var(--transparent-opacity-heavy))
),
rgba(var(--v-theme-surface), var(--transparent-opacity-heavy)) !important;
}
}
html[data-theme="transparent"].transparent-background-blur-disabled {