feat(admin-ui): 引入 Toast 反馈(Ant Design Pro 风格基线)

This commit is contained in:
萝卜
2026-03-15 17:41:45 +08:00
parent 71ad4becb9
commit 3011619ee2
4 changed files with 168 additions and 3 deletions

View File

@@ -1,8 +1,63 @@
/*
* SaaSShop Admin Components
* 说明用于承接 Blade 中零散的 inline style便于后续统一美化与治理
*
* 美化方向Ant Design Pro 风格规整企业中后台范式
*/
/* Toast渐进增强配合 admin.js 展示更友好的反馈提示) */
.toast-container{
position:fixed;
top:16px;
right:16px;
z-index:999;
display:flex;
flex-direction:column;
gap:10px;
width:min(420px, calc(100vw - 32px));
}
.toast{
background:#111827;
border:1px solid #334155;
border-left-width:4px;
border-radius:12px;
padding:12px 12px;
color:#e5e7eb;
box-shadow:0 14px 30px rgba(0,0,0,.35);
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:12px;
}
.toast-success{border-left-color:#16a34a;}
.toast-warning{border-left-color:#f59e0b;}
.toast-error{border-left-color:#ef4444;}
.toast-content{
font-size:13px;
line-height:1.45;
word-break:break-word;
}
.toast-close{
appearance:none;
border:none;
background:transparent;
color:#94a3b8;
font-size:18px;
line-height:1;
cursor:pointer;
padding:2px 6px;
border-radius:8px;
}
.toast-close:hover{
background:#1f2937;
color:#e5e7eb;
}
.form-inline-row{
display:flex;
align-items:center;