feat(admin): 独立后台壳、站点分析与聊天监管，公开站拆出主题切换与访问埋点
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -1439,6 +1439,264 @@ body:has([data-chat-viewport]) #main {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* ── 管理后台独立壳：全高侧栏 + 顶栏 + 可滚主区（不依赖公开 Header/Footer） ── */
|
||||
body:has([data-admin-viewport]) {
|
||||
height: 100dvh;
|
||||
max-height: 100dvh;
|
||||
overflow: hidden;
|
||||
background: var(--bg);
|
||||
}
|
||||
|
||||
.admin-shell {
|
||||
display: flex;
|
||||
height: 100dvh;
|
||||
max-height: 100dvh;
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
background: var(--bg);
|
||||
}
|
||||
|
||||
.admin-rail {
|
||||
width: 15.5rem;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 0;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
padding: 1rem 0.75rem 1.25rem;
|
||||
background: var(--panel);
|
||||
border-right: 1px solid var(--line);
|
||||
}
|
||||
|
||||
/* 桌面常驻侧栏；窄屏改用抽屉，避免与 .admin-rail 的 display 冲突 */
|
||||
.admin-rail-desktop {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
.admin-rail-desktop {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1280px) {
|
||||
.admin-rail {
|
||||
width: 16.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.admin-drawer-panel {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
width: min(18rem, 86vw);
|
||||
height: 100%;
|
||||
box-shadow: var(--shadow-lg);
|
||||
animation: admin-drawer-in 0.18s ease-out;
|
||||
}
|
||||
|
||||
.admin-rail-brand {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.625rem;
|
||||
padding: 0.35rem 0.5rem 1rem;
|
||||
margin-bottom: 0.35rem;
|
||||
border-bottom: 1px solid var(--line);
|
||||
}
|
||||
|
||||
.admin-rail-brand-mark {
|
||||
width: 2.25rem;
|
||||
height: 2.25rem;
|
||||
border-radius: 0.75rem;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
background: var(--accent);
|
||||
color: var(--accent-on);
|
||||
}
|
||||
|
||||
.admin-rail-nav {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
padding: 0.75rem 0 0.25rem;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.admin-rail-group-title {
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.04em;
|
||||
text-transform: uppercase;
|
||||
color: var(--ink-3);
|
||||
padding: 0 0.65rem 0.4rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.admin-rail-link {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.625rem;
|
||||
padding: 0.55rem 0.75rem;
|
||||
border-radius: 0.75rem;
|
||||
font-size: 13.5px;
|
||||
font-weight: 500;
|
||||
color: var(--ink-2);
|
||||
transition: background-color 0.15s ease, color 0.15s ease;
|
||||
}
|
||||
|
||||
.admin-rail-link:hover {
|
||||
background: var(--panel-2);
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
.admin-rail-link.is-active {
|
||||
background: var(--nav-active-bg);
|
||||
color: var(--nav-active-ink);
|
||||
}
|
||||
|
||||
.admin-rail-link.is-active svg {
|
||||
color: var(--nav-active-ink);
|
||||
}
|
||||
|
||||
.admin-rail-link:not(.is-active) svg {
|
||||
color: var(--ink-3);
|
||||
}
|
||||
|
||||
.admin-main-col {
|
||||
flex: 1 1 0;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.admin-topbar {
|
||||
height: 3.5rem;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 0.75rem;
|
||||
padding: 0 1rem;
|
||||
background: color-mix(in srgb, var(--bg) 88%, transparent);
|
||||
backdrop-filter: blur(14px);
|
||||
-webkit-backdrop-filter: blur(14px);
|
||||
border-bottom: 1px solid var(--line);
|
||||
z-index: 30;
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
.admin-topbar {
|
||||
padding: 0 1.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.admin-topbar-left,
|
||||
.admin-topbar-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.admin-topbar-back {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.4rem;
|
||||
padding: 0.4rem 0.75rem;
|
||||
border-radius: 999px;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: var(--ink-2);
|
||||
transition: background-color 0.15s ease, color 0.15s ease;
|
||||
}
|
||||
|
||||
.admin-topbar-back:hover {
|
||||
background: var(--panel);
|
||||
color: var(--ink);
|
||||
}
|
||||
|
||||
.admin-topbar-user {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
border-radius: 999px;
|
||||
padding: 0.2rem 0.55rem 0.2rem 0.2rem;
|
||||
border: 1px solid var(--line);
|
||||
transition: border-color 0.15s ease, background-color 0.15s ease;
|
||||
}
|
||||
|
||||
.admin-canvas {
|
||||
flex: 1 1 0;
|
||||
min-height: 0;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
padding: 1.25rem 1rem 2rem;
|
||||
}
|
||||
|
||||
/* 内容管理：桌面禁整页滚动，三栏底部落在视口内 */
|
||||
@media (min-width: 1024px) {
|
||||
.admin-canvas:has(.admin-content-page) {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
padding-bottom: 1.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
.admin-canvas {
|
||||
padding: 1.5rem 1.5rem 2.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
.admin-canvas {
|
||||
padding: 1.75rem 2rem 2.75rem;
|
||||
}
|
||||
.admin-canvas:has(.admin-content-page) {
|
||||
padding-bottom: 1.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* 移动端导航抽屉 */
|
||||
.admin-drawer {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 60;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.admin-drawer-backdrop {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
background: color-mix(in srgb, var(--ink) 28%, transparent);
|
||||
}
|
||||
|
||||
@keyframes admin-drawer-in {
|
||||
from {
|
||||
transform: translateX(-100%);
|
||||
opacity: 0.85;
|
||||
}
|
||||
to {
|
||||
transform: translateX(0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.admin-drawer-panel {
|
||||
animation: none;
|
||||
}
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: var(--accent);
|
||||
color: var(--accent-on);
|
||||
@@ -1913,20 +2171,244 @@ a.j13-mention-token:hover {
|
||||
}
|
||||
}
|
||||
|
||||
/* 内容管理工具条：类型 / 状态 / 搜索同一行，避免三行左对齐或等分顶栏留白 */
|
||||
.admin-content-toolbar {
|
||||
/* 内容管理页：窄屏可整页滚；桌面高度由上方未分层的 canvas:has 规则锁定 */
|
||||
.admin-content-page {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.75rem;
|
||||
min-height: 0;
|
||||
}
|
||||
@media (min-width: 1024px) {
|
||||
.admin-content-page {
|
||||
flex: 1 1 auto;
|
||||
min-height: 0;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.admin-content-page > .mb-5 {
|
||||
margin-bottom: 0 !important;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.admin-content-page > .mb-5 h1 {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
@media (min-width: 640px) {
|
||||
.admin-content-page > .mb-5 h1 {
|
||||
font-size: 1.375rem;
|
||||
}
|
||||
}
|
||||
.admin-content-page > .mb-5 .meta {
|
||||
margin-top: 0.25rem;
|
||||
}
|
||||
|
||||
/* 策略条：横向排布，压缩垂直占用 */
|
||||
.admin-content-policy {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 0.75rem 1rem;
|
||||
padding: 0.75rem 1rem;
|
||||
gap: 0.65rem 0.85rem;
|
||||
flex-wrap: wrap;
|
||||
flex-shrink: 0;
|
||||
padding: 0.5rem 0.75rem;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: 12px;
|
||||
background: var(--panel);
|
||||
}
|
||||
.admin-content-policy-title {
|
||||
font-size: 12px;
|
||||
font-weight: 650;
|
||||
color: var(--ink-3);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.admin-content-policy-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.35rem 0.5rem;
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.admin-content-policy-chip {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
padding: 0.28rem 0.55rem;
|
||||
border-radius: 10px;
|
||||
background: var(--panel-2);
|
||||
border: 1px solid transparent;
|
||||
min-height: 2.25rem;
|
||||
}
|
||||
.admin-content-policy-chip-label {
|
||||
font-size: 12.5px;
|
||||
font-weight: 600;
|
||||
color: var(--ink);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* 内容管理：PC 左中右三栏等高；仅列表区滚动 */
|
||||
.admin-content-triptych {
|
||||
display: grid;
|
||||
gap: 0.85rem;
|
||||
align-items: stretch;
|
||||
min-height: 18rem;
|
||||
}
|
||||
@media (min-width: 1024px) {
|
||||
.admin-content-triptych {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 1rem;
|
||||
flex: 1 1 auto;
|
||||
min-height: 0;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
.admin-messages-panel {
|
||||
flex: 1 1 auto;
|
||||
min-height: 0;
|
||||
}
|
||||
/* 私聊监管：方向条与正文同一卡片，无间隙 */
|
||||
.admin-dm-row {
|
||||
min-width: 0;
|
||||
}
|
||||
.admin-dm-card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
border-radius: 0.55rem;
|
||||
background: var(--panel-2);
|
||||
border: 1px solid var(--line);
|
||||
overflow: hidden;
|
||||
}
|
||||
.admin-dm-card-head {
|
||||
padding: 0.4rem 0.65rem;
|
||||
border-bottom: 1px solid var(--line);
|
||||
}
|
||||
.admin-dm-card-body {
|
||||
padding: 0.55rem 0.7rem 0.65rem;
|
||||
}
|
||||
.admin-dm-pair-meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.45rem;
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
}
|
||||
.admin-dm-pair-names {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.35rem;
|
||||
min-width: 0;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
.admin-dm-person {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.35rem;
|
||||
min-width: 0;
|
||||
}
|
||||
.admin-dm-person-name {
|
||||
font-size: 12.5px;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.01em;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
max-width: 7.5rem;
|
||||
}
|
||||
.admin-dm-arrow {
|
||||
flex-shrink: 0;
|
||||
font-weight: 500;
|
||||
color: var(--ink-3);
|
||||
font-size: 11px;
|
||||
}
|
||||
.admin-content-col {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
@media (min-width: 1024px) {
|
||||
.admin-content-col {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.admin-content-col-head,
|
||||
.admin-content-col-toolbar,
|
||||
.admin-content-col-pager {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.admin-content-col-body {
|
||||
flex: 1 1 auto;
|
||||
min-height: 0;
|
||||
overflow-y: auto;
|
||||
overscroll-behavior: contain;
|
||||
}
|
||||
.admin-content-col-toolbar {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.55rem;
|
||||
padding: 0.65rem 0.75rem;
|
||||
border-bottom: 1px solid var(--line);
|
||||
background: var(--panel);
|
||||
}
|
||||
@media (min-width: 640px) {
|
||||
.admin-content-toolbar {
|
||||
padding: 0.75rem 1.25rem;
|
||||
}
|
||||
.admin-content-action {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.3rem;
|
||||
padding: 0.28rem 0.55rem;
|
||||
border-radius: 8px;
|
||||
border: 1px solid var(--line);
|
||||
background: var(--panel);
|
||||
color: var(--ink-2);
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
line-height: 1.2;
|
||||
cursor: pointer;
|
||||
transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
|
||||
}
|
||||
.admin-content-action:hover:not(:disabled) {
|
||||
background: var(--panel-2);
|
||||
color: var(--ink);
|
||||
border-color: var(--line-2);
|
||||
}
|
||||
.admin-content-action:disabled {
|
||||
opacity: 0.55;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.admin-content-action.is-danger {
|
||||
color: var(--danger);
|
||||
border-color: color-mix(in srgb, var(--danger) 28%, var(--line));
|
||||
background: color-mix(in srgb, var(--danger) 6%, var(--panel));
|
||||
}
|
||||
.admin-content-action.is-danger:hover:not(:disabled) {
|
||||
background: color-mix(in srgb, var(--danger) 12%, var(--panel));
|
||||
}
|
||||
.admin-content-action.is-ok {
|
||||
color: var(--ok);
|
||||
border-color: color-mix(in srgb, var(--ok) 28%, var(--line));
|
||||
background: color-mix(in srgb, var(--ok) 6%, var(--panel));
|
||||
}
|
||||
.admin-content-clamp {
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 3;
|
||||
overflow: hidden;
|
||||
word-break: break-word;
|
||||
}
|
||||
.admin-content-clamp.is-open {
|
||||
display: block;
|
||||
-webkit-line-clamp: unset;
|
||||
}
|
||||
/* 三栏宽度下状态条横向滚动，避免折行难看 */
|
||||
.admin-content-col-toolbar .admin-content-status-scroll {
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
.admin-content-col-toolbar .admin-content-status-scroll > div {
|
||||
flex-wrap: nowrap !important;
|
||||
}
|
||||
.admin-content-col-toolbar .admin-content-status-scroll .admin-seg {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.admin-content-kind {
|
||||
display: inline-flex;
|
||||
@@ -1979,35 +2461,6 @@ a.j13-mention-token:hover {
|
||||
background: var(--accent-soft);
|
||||
color: var(--accent);
|
||||
}
|
||||
.admin-content-split {
|
||||
display: none;
|
||||
width: 1px;
|
||||
height: 1.5rem;
|
||||
background: var(--line);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.admin-content-status {
|
||||
flex: 1 1 14rem;
|
||||
min-width: 0;
|
||||
}
|
||||
.admin-content-search {
|
||||
flex: 1 1 12rem;
|
||||
max-width: 18rem;
|
||||
min-width: 11rem;
|
||||
margin-left: auto;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.admin-content-split {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.admin-content-search {
|
||||
flex-basis: 100%;
|
||||
max-width: none;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.admin-field-head {
|
||||
display: flex;
|
||||
@@ -2059,14 +2512,16 @@ a.j13-mention-token:hover {
|
||||
.admin-search-shell {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
height: 2.5rem;
|
||||
padding: 0 0.75rem;
|
||||
gap: 0.625rem;
|
||||
min-height: 2.875rem;
|
||||
height: 2.875rem;
|
||||
padding: 0 0.875rem;
|
||||
}
|
||||
.admin-search-shell .admin-field-input {
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
font-size: 13px;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.admin-stepper {
|
||||
|
||||
Reference in New Issue
Block a user