/* 新闻内容:卡片列表、图片摘要和详情正文。 */ /* 导入方:app/pages/news.vue、app/pages/resources.vue。 */ .news-list[data-v-0f61b69d] { flex-direction: column; gap: 12px; display: flex; } .news-card[data-v-0f61b69d] { text-align: left; background: var(--p-content-background); border: 1px solid var(--p-content-border-color, #e2e8f0); cursor: pointer; border-radius: var(--radius-lg); gap: 14px; width: 100%; padding: 16px 18px; transition: border-color 0.15s; display: flex; } .news-card[data-v-0f61b69d]:hover { border-color: var(--p-primary-color); } .news-img[data-v-0f61b69d] { -o-object-fit: cover; object-fit: cover; border-radius: var(--radius-md); flex-shrink: 0; width: 120px; height: 76px; } .news-main[data-v-0f61b69d] { flex-direction: column; flex: 1; gap: 6px; min-width: 0; display: flex; } .news-title[data-v-0f61b69d] { color: var(--p-text-color); font-size: 1.0625rem; } .news-excerpt[data-v-0f61b69d] { -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; font-size: 0.9375rem; line-height: 1.7; display: -webkit-box; overflow: hidden; } .news-excerpt[data-v-0f61b69d], .news-meta[data-v-0f61b69d] { color: var(--p-text-muted-color, #94a3b8); } .news-meta[data-v-0f61b69d] { align-items: center; gap: 10px; font-size: 0.875rem; display: flex; } .news-detail[data-v-0f61b69d] { flex-direction: column; gap: 14px; display: flex; } .news-detail-time[data-v-0f61b69d] { color: var(--p-text-muted-color, #94a3b8); font-size: 0.875rem; } .news-detail-html[data-v-0f61b69d] { color: var(--p-text-color, #334155); word-break: break-word; max-height: 60vh; font-size: 1rem; line-height: 1.9; overflow-y: auto; } .news-detail-html[data-v-0f61b69d] img { max-width: 100%; height: auto; } .news-detail-html[data-v-0f61b69d] table { border-collapse: collapse; max-width: 100%; } .news-detail-html[data-v-0f61b69d] td, .news-detail-html[data-v-0f61b69d] th { border: 1px solid var(--p-content-border-color, #e2e8f0); padding: 6px 10px; } /* 视口条件 (width<=768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */ @media (width<=768px) { .news-img[data-v-0f61b69d] { display: none; } } .list-page[data-v-0f61b69d] { gap: 21px; } .list-head h2[data-v-0f61b69d], .page-head h2[data-v-0f61b69d] { margin: 0; font-size: var(--page-title-size); font-weight: 600; line-height: 24.5px; } .list-toolbar[data-v-0f61b69d], .list-toolbar-right[data-v-0f61b69d] { justify-content: flex-start; gap: 7px; } .list-search[data-v-0f61b69d], .list-select[data-v-0f61b69d] { width: 280px; } .list-table[data-v-0f61b69d] { border-radius: var(--radius-md); box-shadow: 0 1px 3px #0f172a12; } .list-foot[data-v-0f61b69d] { justify-content: center; } .list-foot > .list-bulk[data-v-0f61b69d]:empty { display: none; } [data-v-0f61b69d] .p-datatable-header-cell { background: var(--p-content-hover-background); padding: 10.5px 14px; font-size: 1rem; font-weight: 600; } [data-v-0f61b69d] .p-datatable-tbody > tr > td { padding: 10.5px 14px; font-size: 1rem; } [data-v-0f61b69d] .p-tag { font-size: 0.875rem; font-weight: 500; } [data-v-0f61b69d] .list-empty { gap: 14px; min-height: 300px; padding: 42px 21px; } [data-v-0f61b69d] .list-empty i { opacity: 1; font-size: 1.875rem; } [data-v-0f61b69d] .list-empty-title { font-size: 1rem; } [data-v-0f61b69d] .list-empty-desc { font-size: 0.875rem; } .field[data-v-0f61b69d] { gap: 7px; } .field label[data-v-0f61b69d] { font-size: 0.875rem; } /* 视口条件 (width<=768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */ @media (width<=768px) { .list-search[data-v-0f61b69d], .list-select[data-v-0f61b69d], .list-toolbar-right[data-v-0f61b69d] { width: 100%; } } .news-card[data-v-0f61b69d] { border-radius: var(--radius-md); padding: 14px; box-shadow: 0 1px 3px #0f172a0a; } .news-title[data-v-0f61b69d] { font-size: 1rem; font-weight: 600; } .news-excerpt[data-v-0f61b69d], .news-meta[data-v-0f61b69d] { font-size: 0.875rem; } .news-list[data-v-0f61b69d] { gap: 14px; } .list-toolbar[data-v-0f61b69d] { flex-wrap: wrap; } .list-toolbar[data-v-0f61b69d] .list-segments { background: 0 0; padding: 0; } .list-toolbar[data-v-0f61b69d] .list-seg { border: 0; border-radius: 0; padding: 10.5px 14px; } .list-toolbar[data-v-0f61b69d] .list-seg.active { box-shadow: none; color: var(--p-primary-color); border-bottom: 2px solid var(--p-primary-color); background: 0 0; }