style(message): 统一 Message toast 视觉风格并清理 emoji
- 登录成功/设置保存/清理完成等 toast 去掉 emoji,保持文字简洁 - 全局 .el-message 增加 14px 圆角、统一 padding,字体与设计系统对齐 - success 类型定制橙色圆形图标底 + 白色对勾,匹配暗色暖色主题
This commit is contained in:
@@ -241,9 +241,37 @@ html[data-theme="dark"] .ambient::after {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* —— Element Plus Message 全局覆盖:使用设计系统变量,双主题均可读 —— */
|
/* —— Element Plus Message 全局覆盖:使用设计系统变量,双主题均可读 —— */
|
||||||
.el-message { background: var(--card) !important; border-color: var(--line) !important; box-shadow: var(--shadow) !important; }
|
.el-message {
|
||||||
.el-message__content { color: var(--ink) !important; }
|
background: var(--card) !important;
|
||||||
.el-message .el-message__icon { color: var(--orange) !important; }
|
border-color: var(--line) !important;
|
||||||
|
box-shadow: var(--shadow) !important;
|
||||||
|
border-radius: 14px !important;
|
||||||
|
padding: 12px 22px 12px 16px !important;
|
||||||
|
min-width: unset !important;
|
||||||
|
}
|
||||||
|
.el-message__content { color: var(--ink) !important; font-weight: 500; font-size: 13.5px; }
|
||||||
|
|
||||||
|
/* Success 定制:圆形橙色图标底 + 白色对勾,匹配暗色暖色风格 */
|
||||||
|
.el-message.el-message--success .el-message__icon {
|
||||||
|
position: relative !important;
|
||||||
|
width: 22px; height: 22px;
|
||||||
|
display: inline-flex; align-items: center; justify-content: center;
|
||||||
|
margin-right: 10px;
|
||||||
|
color: #fff !important;
|
||||||
|
font-size: 13px;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.el-message.el-message--success .el-message__icon::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute; inset: 0;
|
||||||
|
background: var(--orange);
|
||||||
|
border-radius: 50%;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
/* 按类型还原图标颜色(success 已覆盖为白色) */
|
||||||
|
.el-message.el-message--warning .el-message__icon { color: var(--orange) !important; }
|
||||||
|
.el-message.el-message--error .el-message__icon { color: var(--red) !important; }
|
||||||
|
.el-message.el-message--info .el-message__icon { color: var(--blue) !important; }
|
||||||
|
|
||||||
/* —— 响应式断点(桌面 ≥1024 / 平板 768~1023 / 手机 <768) —— */
|
/* —— 响应式断点(桌面 ≥1024 / 平板 768~1023 / 手机 <768) —— */
|
||||||
@media (max-width: 1023px) {
|
@media (max-width: 1023px) {
|
||||||
|
|||||||
@@ -26,7 +26,7 @@ async function login() {
|
|||||||
ElMessage.error(res.message || '用户名或密码错误')
|
ElMessage.error(res.message || '用户名或密码错误')
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
ElMessage.success('欢迎回来 👋')
|
ElMessage.success('欢迎回来')
|
||||||
router.push(route.query.redirect || '/')
|
router.push(route.query.redirect || '/')
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -77,7 +77,7 @@ async function onCleanConfirmed(res) {
|
|||||||
function quickClean() {
|
function quickClean() {
|
||||||
const warnPkg = state.packages.find(p => p.status === 'warn')
|
const warnPkg = state.packages.find(p => p.status === 'warn')
|
||||||
if (warnPkg) openClean(warnPkg)
|
if (warnPkg) openClean(warnPkg)
|
||||||
else ElMessage.info('暂无预警包需要清理 🎉')
|
else ElMessage.info('暂无预警包需要清理')
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@@ -80,7 +80,7 @@ async function doSave() {
|
|||||||
exceptions: form.exceptions,
|
exceptions: form.exceptions,
|
||||||
})
|
})
|
||||||
saved.value = true
|
saved.value = true
|
||||||
ElMessage.success('设置已保存,包列表状态已重新计算 ✅')
|
ElMessage.success('设置已保存,包列表状态已重新计算')
|
||||||
setTimeout(() => (saved.value = false), 3000)
|
setTimeout(() => (saved.value = false), 3000)
|
||||||
} finally {
|
} finally {
|
||||||
saving.value = false
|
saving.value = false
|
||||||
|
|||||||
Reference in New Issue
Block a user