张磊
2 lines
7.8 KiB
CSS
2 lines
7.8 KiB
CSS
.archive-detail-page[data-v-c6479eee]{min-height:calc(100vh - 120px);padding:20px 24px 28px;background:var(--el-fill-color-extra-light);box-sizing:border-box}.state-card[data-v-c6479eee]{border-radius:12px;border:1px solid var(--el-border-color-lighter)}.page-head[data-v-c6479eee]{margin-bottom:16px}.page-title[data-v-c6479eee]{margin:0;font-size:20px;font-weight:600;color:var(--el-text-color-primary);letter-spacing:.02em}.page-subtitle[data-v-c6479eee]{margin:8px 0 0;font-size:13px;color:var(--el-text-color-secondary)}.detail-card[data-v-c6479eee]{border-radius:12px;border:1px solid var(--el-border-color-lighter);overflow:hidden}[data-v-c6479eee] .detail-card .el-card__body{padding:20px 22px 24px}.detail-body[data-v-c6479eee]{display:flex;gap:22px;align-items:flex-start}.viewers-col[data-v-c6479eee]{flex:1;min-width:0;display:flex;flex-direction:column;gap:18px}.compare-row[data-v-c6479eee]{display:flex;gap:18px;align-items:stretch}.compare-row--single .compare-pane[data-v-c6479eee]{max-width:100%}.compare-pane[data-v-c6479eee]{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px;background:var(--el-bg-color);border:1px solid var(--el-border-color-lighter);border-radius:12px;box-shadow:0 1px 2px #0000000a;overflow:hidden}.compare-pane--b .pane-head[data-v-c6479eee]{background:linear-gradient(180deg,rgba(64,158,255,.06) 0%,var(--el-bg-color) 100%)}.pane-head[data-v-c6479eee]{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 14px;background:linear-gradient(180deg,rgba(82,168,87,.08) 0%,var(--el-bg-color) 100%);border-bottom:1px solid var(--el-border-color-extra-light)}.pane-tag[data-v-c6479eee]{font-size:13px;font-weight:600;padding:5px 12px;border-radius:20px;letter-spacing:.02em}.pane-tag--a[data-v-c6479eee]{color:#458d49;background:rgba(82,168,87,.14);border:1px solid rgba(82,168,87,.25)}.pane-tag--b[data-v-c6479eee]{color:#409eff;background:rgba(64,158,255,.1);border:1px solid rgba(64,158,255,.22)}.pane-time[data-v-c6479eee]{font-size:13px;color:var(--el-text-color-regular);display:flex;align-items:center;gap:8px;flex-wrap:wrap}.pane-time__label[data-v-c6479eee]{font-size:12px;color:var(--el-text-color-secondary)}.viewer-card[data-v-c6479eee]{flex:1;min-height:300px;max-height:52vh;margin:0 12px 4px;padding:14px;background:var(--el-fill-color-dark);border-radius:10px;border:1px solid var(--el-border-color)}html.dark .viewer-card[data-v-c6479eee]{background:#0d0d10;border-color:var(--el-border-color)}.viewer-hint[data-v-c6479eee]{margin:0 12px 12px;font-size:12px;color:var(--el-text-color-secondary);text-align:center;line-height:1.5}.triptych[data-v-c6479eee]{display:flex;gap:12px;height:100%;min-height:272px;max-height:47vh}.triptych-panel[data-v-c6479eee]{position:relative;background:#0a0a0c;border-radius:10px;border:1px solid rgba(255,255,255,.08);overflow:hidden;display:flex;align-items:center;justify-content:center}.triptych-panel.is-empty[data-v-c6479eee]{background:rgba(0,0,0,.35)}.triptych-center[data-v-c6479eee]{flex:1;min-width:0;border-color:#52a85773;box-shadow:0 0 0 1px #52a8571f}.triptych-side[data-v-c6479eee]{flex:0 0 20%;min-width:76px;max-width:148px}.triptych-side[data-v-c6479eee]:not(.is-empty){cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease}.triptych-side[data-v-c6479eee]:not(.is-empty):hover{border-color:#52a857a6;box-shadow:0 0 0 1px #52a85733}.triptych-img[data-v-c6479eee]{width:100%;height:100%;display:block}.triptych-img--side[data-v-c6479eee]{object-fit:cover;object-position:center}.triptych-img--center[data-v-c6479eee]{object-fit:contain;object-position:center;max-height:45vh}.panel-empty[data-v-c6479eee],.pane-empty[data-v-c6479eee]{font-size:12px;color:#6b6b75}.pane-empty[data-v-c6479eee]{display:flex;align-items:center;justify-content:center;min-height:200px;color:var(--el-text-color-placeholder)}.single-wrap[data-v-c6479eee]{display:flex;align-items:center;justify-content:center;height:100%;min-height:248px}.single-img[data-v-c6479eee]{max-width:100%;max-height:45vh;object-fit:contain}.thumb-section[data-v-c6479eee]{padding:14px 16px 16px;background:var(--el-bg-color);border:1px solid var(--el-border-color-lighter);border-radius:12px;box-shadow:0 1px 2px #0000000a}.thumb-section-head[data-v-c6479eee]{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}.thumb-section-title[data-v-c6479eee]{font-size:14px;font-weight:600;color:var(--el-text-color-primary)}.thumb-section-actions[data-v-c6479eee]{display:flex;align-items:center;gap:10px;min-width:0}.thumb-section-active[data-v-c6479eee]{font-size:12px;color:#52a857;font-weight:500;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.thumb-strip-wrap[data-v-c6479eee]{padding-top:2px}.thumb-strip[data-v-c6479eee]{display:flex;flex-wrap:nowrap;gap:10px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin;scrollbar-color:var(--el-border-color) transparent}.thumb-strip[data-v-c6479eee]::-webkit-scrollbar{height:6px}.thumb-strip[data-v-c6479eee]::-webkit-scrollbar-thumb{background:var(--el-border-color);border-radius:999px}.thumb-btn[data-v-c6479eee]{flex:0 0 auto;width:76px;padding:0;border:none;background:transparent;cursor:pointer;color:var(--el-text-color-secondary);font-size:11px;text-align:center;transition:color .15s ease}.thumb-btn__frame[data-v-c6479eee]{display:block;padding:3px;border-radius:10px;border:2px solid transparent;background:var(--el-fill-color-light);transition:border-color .15s ease,box-shadow .15s ease}.thumb-btn img[data-v-c6479eee]{width:100%;aspect-ratio:1;object-fit:cover;border-radius:7px;display:block}.thumb-btn__placeholder[data-v-c6479eee]{width:100%;aspect-ratio:1;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--el-text-color-placeholder);background:var(--el-fill-color)}.thumb-btn__label[data-v-c6479eee]{display:block;margin-top:6px;padding:0 2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.thumb-btn[data-v-c6479eee]:hover{color:var(--el-text-color-primary)}.thumb-btn:hover .thumb-btn__frame[data-v-c6479eee]{border-color:var(--el-border-color)}.thumb-btn.active .thumb-btn__frame[data-v-c6479eee]{border-color:#52a857;box-shadow:0 2px 12px #52a85733}.metrics-aside[data-v-c6479eee]{width:292px;flex-shrink:0;position:sticky;max-height:calc(100vh - 100px);overflow-y:auto}.metric-card[data-v-c6479eee]{border:1px solid var(--el-border-color-lighter);border-radius:12px;overflow:hidden;background:var(--el-bg-color);box-shadow:0 1px 3px #0000000f}.metric-card-head[data-v-c6479eee]{padding:14px 16px;border-bottom:1px solid var(--el-border-color-extra-light);background:var(--el-fill-color-extra-light)}.metric-card-head h3[data-v-c6479eee]{margin:0;font-size:15px;font-weight:600;color:var(--el-text-color-primary)}.metric-sub[data-v-c6479eee]{margin:8px 0 0;font-size:12px;color:var(--el-text-color-secondary);line-height:1.45}.metric-card-body[data-v-c6479eee]{padding:12px 14px 16px}.metric-row[data-v-c6479eee]{padding:10px 12px 12px;margin-bottom:8px;border-radius:10px;background:var(--el-fill-color-light);border:1px solid var(--el-border-color-extra-light)}.metric-row[data-v-c6479eee]:last-child{margin-bottom:0}.metric-head[data-v-c6479eee]{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:13px}.metric-name[data-v-c6479eee]{color:var(--el-text-color-regular)}.metric-num[data-v-c6479eee]{color:#52a857;font-weight:600;font-variant-numeric:tabular-nums}.metric-empty[data-v-c6479eee]{font-size:13px;color:var(--el-text-color-secondary);text-align:center;padding:16px 0}[data-v-c6479eee] .el-progress-bar__outer{border-radius:999px;background-color:var(--el-fill-color-dark)}[data-v-c6479eee] .el-progress-bar__inner{border-radius:999px}@media (max-width: 1200px){.detail-body[data-v-c6479eee]{flex-direction:column}.metrics-aside[data-v-c6479eee]{width:100%;position:static;max-height:none}.compare-row[data-v-c6479eee]{flex-direction:column}}
|