html/client-web
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
wujinliang
2026-08-27 21:49:18 +08:00
parent 458c8d5961
commit 22f0528593
14 changed files with 73 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/modules/notifications/views/NotificationsView.vue
+11
View File
@@ -44,4 +44,15 @@ onMounted(() => { void Promise.all([load(), notifications.refreshUnreadCount()])
<style scoped>
.notification-page{display:flex;flex-direction:column;gap:16px}.page-heading{display:flex;justify-content:space-between;color:var(--navy)}.page-heading h1{margin:2px 0 5px;font-size:24px}.page-heading p:not(.eyebrow){margin:0;color:var(--muted);font-size:13px}.eyebrow{margin:0;color:var(--primary);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.content-card{padding:16px;border:1px solid var(--border);border-radius:8px;background:var(--surface,#fff)}.filter-bar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.mark-all{margin-left:auto}.state-panel{display:flex;min-height:180px;align-items:center;justify-content:center;flex-direction:column;gap:12px;text-align:center}.state-panel--error{color:#b42318;background:#fff8f7;border:1px solid #f5c2bd;border-radius:6px}.state-panel p{margin:0}.table-empty{display:flex;align-items:center;flex-direction:column;gap:8px;padding:42px 12px;color:var(--muted)}.table-empty strong{color:var(--navy)}.table-empty span{font-size:12px}.pagination-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:14px;color:var(--muted);font-size:12px}@media(max-width:720px){.content-card{padding:12px}.mark-all{margin-left:0;width:100%}.filter-bar .el-select,.filter-bar>.el-button{flex:1}.pagination-row{align-items:flex-start;flex-direction:column}.page-heading h1{font-size:21px}}
/* Keep the notification filters compact and aligned with the other client lists. */
.filter-bar { align-items: flex-end; }
.filter-bar > .el-select { width: 190px; }
.filter-bar > .el-input { width: 260px; }
.filter-bar > .el-button { flex: 0 0 auto; min-height: 32px; }
.filter-bar > .el-button + .el-button { margin-left: 0; }
@media (max-width: 720px) {
.filter-bar { align-items: stretch; flex-direction: column; }
.filter-bar > .el-select, .filter-bar > .el-input { width: 100%; }
.filter-bar > .el-button { width: 100%; }
}
</style>