/* 站内消息:筛选、批量选中、未读标记及消息详情导航。 */ /* 导入方:app/pages/messages/index.vue。 */ .list-page[data-v-e9dbafec] { gap: 21px; } .page-heading h2[data-v-e9dbafec] { margin: 0; font-size: var(--page-title-size); font-weight: 600; line-height: 2rem; } .page-heading p[data-v-e9dbafec] { color: var(--p-text-muted-color); margin: 4px 0 0; font-size: 0.9375rem; } .message-panel[data-v-e9dbafec] { border: 1px solid var(--console-panel-border); background: var(--console-panel-bg); border-radius: var(--radius-md); min-width: 0; overflow: hidden; } .list-toolbar[data-v-e9dbafec] { border-bottom: 1px solid var(--console-panel-border); padding: 20px; } .list-toolbar-right[data-v-e9dbafec] { flex: 1; gap: 10px; } .search-field[data-v-e9dbafec] { flex: 1; min-width: 200px; max-width: 340px; } .search-field .list-search[data-v-e9dbafec] { width: 100%; } .list-select[data-v-e9dbafec] { width: 150px; } /* 批量消息操作区与普通查询工具栏分开,选中状态来自页面数据。 */ .selection-toolbar[data-v-e9dbafec] { flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; min-height: 58px; padding: 10px 20px; display: flex; } .selection-summary[data-v-e9dbafec] { color: var(--p-text-muted-color); font-size: 0.9375rem; } .bulk-actions[data-v-e9dbafec] { align-items: center; gap: 8px; display: flex; } .list-table[data-v-e9dbafec] { box-shadow: none; border: 0; border-radius: 0; } .message-error[data-v-e9dbafec] { flex-direction: column; align-items: flex-start; gap: 14px; padding: 20px; display: flex; } .message-panel > .p-message[data-v-e9dbafec] { margin: 0 20px 14px; } [data-v-e9dbafec] .p-datatable-header-cell { background: var(--p-content-hover-background); padding: 12px 20px; font-size: 0.9375rem; font-weight: 600; } [data-v-e9dbafec] .p-datatable-tbody > tr > td { padding: 16px 20px; font-size: 1rem; } [data-v-e9dbafec] .list-empty { min-height: 300px; } /* 允许连续长文本换行,防止IP、密钥或用户输入撑破当前容器;不会修改原始数据。 */ .mail-title[data-v-e9dbafec] { color: var(--p-text-muted-color); cursor: pointer; text-align: left; overflow-wrap: anywhere; background: 0 0; border: 0; align-items: center; gap: 9px; padding: 0; line-height: 1.6; display: inline-flex; } .mail-title[data-v-e9dbafec]:hover { color: var(--p-primary-color); } .mail-title.unread[data-v-e9dbafec] { color: var(--p-text-color); font-weight: 600; } .mail-title.unread[data-v-e9dbafec]:hover { color: var(--p-primary-color); } .mail-dot[data-v-e9dbafec] { background: var(--p-primary-color); border-radius: 50%; flex-shrink: 0; width: 7px; height: 7px; } .list-foot[data-v-e9dbafec] { border-top: 1px solid var(--console-panel-border); justify-content: flex-end; padding: 16px 20px; } .list-foot > .list-bulk[data-v-e9dbafec]:empty { display: none; } .detail-state[data-v-e9dbafec] { flex-direction: column; align-items: flex-start; gap: 18px; padding: 12px 0; display: flex; } .detail-state > .p-skeleton[data-v-e9dbafec] { align-self: stretch; } .detail-meta[data-v-e9dbafec] { border-bottom: 1px solid var(--console-panel-border); color: var(--p-text-muted-color); flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 20px; padding-bottom: 16px; font-size: 0.9375rem; display: flex; } /* 允许连续长文本换行,防止IP、密钥或用户输入撑破当前容器;不会修改原始数据。 */ .detail-body[data-v-e9dbafec] { overflow-wrap: anywhere; font-size: 1rem; line-height: 1.9; overflow-x: auto; } .detail-body[data-v-e9dbafec] img { max-width: 100%; height: auto; } .detail-body[data-v-e9dbafec] a { color: var(--p-primary-color); } .detail-nav[data-v-e9dbafec] { gap: 8px; margin-right: auto; display: flex; } .confirm-text[data-v-e9dbafec] { margin: 0 0 12px; font-size: 1rem; line-height: 1.8; } /* 视口条件 (width<=768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */ @media (width<=768px) { .list-toolbar[data-v-e9dbafec] { padding: 16px; } .list-toolbar-right[data-v-e9dbafec] { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; display: grid; } .search-field[data-v-e9dbafec] { grid-column: 1/-1; min-width: 0; max-width: none; } .list-select[data-v-e9dbafec] { width: 100%; } .selection-toolbar[data-v-e9dbafec] { padding: 10px 16px; } .list-foot[data-v-e9dbafec] { justify-content: center; padding: 14px 8px; } }