Merge pull request #243 from nagisa77/codex/-vue-toastification

Refine toast style
This commit is contained in:
Tim
2025-07-21 19:31:43 +08:00
committed by GitHub
2 changed files with 34 additions and 0 deletions

View File

@@ -0,0 +1,33 @@
/* Custom styles for vue-toastification */
.Vue-Toastification__toast--info {
background-color: #d0e9ff;
color: #1b6ec2;
}
.Vue-Toastification__toast--success {
background-color: #dff6dd;
color: #2b7a2b;
}
.Vue-Toastification__toast--error {
background-color: #ffe4e4;
color: #b73737;
}
@media (max-width: 600px) {
.Vue-Toastification__container {
width: auto;
max-width: 90vw;
right: 0.5em;
left: auto;
}
.Vue-Toastification__toast {
padding: 12px 14px;
}
.Vue-Toastification__toast-body {
font-size: 14px;
line-height: 20px;
}
.Vue-Toastification__close-button {
font-size: 20px;
line-height: 20px;
}
}

View File

@@ -7,6 +7,7 @@ import 'vue-toastification/dist/index.css'
// Use Sugar theme from vue-toast-notification for better toast styling.
// If you prefer Bootstrap style, replace with theme-bootstrap.css instead.
import 'vue-toast-notification/dist/theme-sugar.css'
import './assets/toast.css'
import { useToast } from 'vue-toastification'
import { checkToken, clearToken } from './utils/auth'
import { initTheme } from './utils/theme'