feat(admin-ui): 引入 Toast 反馈(Ant Design Pro 风格基线)
This commit is contained in:
@@ -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;
|
||||
|
||||
Reference in New Issue
Block a user