feat(posts): 类型帖截止时间、抽奖奖品表与悬赏发帖体验
统一投票/悬赏/抽奖截止与状态展示，抽奖支持多奖品行；发帖页悬赏积分对齐表格输入，并在余额不足时于底部就地提示。 Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
@@ -182,30 +182,106 @@ body {
|
||||
box-shadow: var(--shadow);
|
||||
overflow: visible;
|
||||
}
|
||||
.j13-compose-toolbar {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 1rem;
|
||||
padding: 0.75rem 1.25rem;
|
||||
border-bottom: 1px solid var(--line);
|
||||
background: color-mix(in srgb, var(--panel) 92%, var(--panel-2));
|
||||
position: sticky;
|
||||
top: 3.5rem;
|
||||
z-index: 20;
|
||||
border-radius: var(--r) var(--r) 0 0;
|
||||
}
|
||||
@media (min-width: 640px) {
|
||||
.j13-compose-toolbar {
|
||||
padding: 0.85rem 1.75rem;
|
||||
}
|
||||
}
|
||||
.j13-compose-toolbar-title {
|
||||
margin: 0;
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
color: var(--ink);
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
.j13-compose-toolbar-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.j13-compose-body {
|
||||
flex: 1 1 auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 0;
|
||||
padding: 1.35rem 1.35rem 0.85rem;
|
||||
gap: 1.1rem;
|
||||
padding: 1.15rem 1.15rem 0.75rem;
|
||||
gap: 0.85rem;
|
||||
}
|
||||
@media (min-width: 640px) {
|
||||
.j13-compose-body {
|
||||
padding: 1.5rem 1.75rem 0.9rem;
|
||||
gap: 1.15rem;
|
||||
padding: 1.25rem 1.4rem 0.85rem;
|
||||
gap: 0.95rem;
|
||||
}
|
||||
}
|
||||
/* 发帖分区卡片：轻分隔，不过度割裂也不糊成一片 */
|
||||
.j13-compose-section {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.85rem;
|
||||
padding: 1rem 1.1rem 1.1rem;
|
||||
border-radius: 14px;
|
||||
border: 1px solid var(--line);
|
||||
background: color-mix(in srgb, var(--bg) 70%, var(--panel));
|
||||
}
|
||||
.j13-compose-section-title {
|
||||
margin: 0;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.05em;
|
||||
color: var(--ink-3);
|
||||
}
|
||||
.j13-compose-section-writing {
|
||||
background: var(--panel);
|
||||
border-color: color-mix(in srgb, var(--line) 85%, var(--accent) 15%);
|
||||
box-shadow: 0 1px 0 color-mix(in srgb, var(--ink) 3.5%, transparent);
|
||||
flex: 1 1 auto;
|
||||
min-height: 0;
|
||||
}
|
||||
/* 类型面板已在分区内，去掉二次描边避免套娃 */
|
||||
.j13-compose-section .j13-compose-typepanel {
|
||||
padding: 0;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
background: transparent;
|
||||
}
|
||||
.j13-compose-actions {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 0.75rem 1rem;
|
||||
padding: 1rem 1.5rem 1.25rem;
|
||||
border-top: 1px solid var(--line);
|
||||
background: var(--panel);
|
||||
}
|
||||
.j13-compose-actions-error {
|
||||
flex: 1 1 12rem;
|
||||
margin: 0;
|
||||
max-width: min(100%, 28rem);
|
||||
}
|
||||
.j13-compose-actions-end {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 0.65rem;
|
||||
margin-left: auto;
|
||||
}
|
||||
@media (min-width: 640px) {
|
||||
.j13-compose-actions {
|
||||
padding-left: 2rem;
|
||||
@@ -271,6 +347,54 @@ body {
|
||||
border: 1px dashed color-mix(in srgb, var(--accent) 28%, var(--line));
|
||||
background: color-mix(in srgb, var(--accent-soft) 55%, var(--panel));
|
||||
}
|
||||
.j13-lottery-prize-table-wrap {
|
||||
overflow-x: auto;
|
||||
border-radius: 10px;
|
||||
border: 1px solid var(--line);
|
||||
background: var(--panel);
|
||||
}
|
||||
.j13-lottery-prize-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: 13.5px;
|
||||
}
|
||||
.j13-lottery-prize-table th,
|
||||
.j13-lottery-prize-table td {
|
||||
padding: 8px 10px;
|
||||
text-align: left;
|
||||
vertical-align: middle;
|
||||
border-bottom: 1px solid var(--line);
|
||||
}
|
||||
.j13-lottery-prize-table th {
|
||||
font-weight: 600;
|
||||
color: var(--ink-2);
|
||||
background: var(--panel-2);
|
||||
white-space: nowrap;
|
||||
}
|
||||
.j13-lottery-prize-table tbody tr:last-child td {
|
||||
border-bottom: none;
|
||||
}
|
||||
.j13-lottery-prize-table .col-idx {
|
||||
width: 2.5rem;
|
||||
color: var(--ink-3);
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.j13-lottery-prize-table .col-count {
|
||||
width: 6.5rem;
|
||||
}
|
||||
.j13-lottery-prize-table .col-actions {
|
||||
width: 4.5rem;
|
||||
text-align: right;
|
||||
}
|
||||
.j13-lottery-prize-table .j13-compose-field {
|
||||
width: 100%;
|
||||
padding: 7px 10px;
|
||||
font-size: 13.5px;
|
||||
}
|
||||
.j13-lottery-prize-table .j13-compose-field-count {
|
||||
width: 100%;
|
||||
max-width: 5.5rem;
|
||||
}
|
||||
.j13-compose-attach-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -286,6 +410,474 @@ body {
|
||||
border: 1px solid var(--line);
|
||||
background: var(--panel);
|
||||
}
|
||||
|
||||
/* 抽奖卡：对齐截图结构，落在站点石墨/令牌体系内 */
|
||||
/* 类型帖交互卡（投票 / 悬赏 / 抽奖）共用壳 */
|
||||
.j13-typed-card {
|
||||
padding: 16px 18px 14px;
|
||||
}
|
||||
.j13-typed-head {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 10px 14px;
|
||||
}
|
||||
.j13-typed-head-main {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
min-width: 0;
|
||||
}
|
||||
.j13-typed-title {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
margin: 0;
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.01em;
|
||||
color: var(--ink);
|
||||
}
|
||||
.j13-typed-title svg {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.j13-typed-title.is-question {
|
||||
color: var(--ink);
|
||||
}
|
||||
.j13-typed-title.is-poll {
|
||||
color: var(--accent);
|
||||
}
|
||||
.j13-typed-title.is-bounty {
|
||||
color: var(--clay);
|
||||
}
|
||||
.j13-typed-title.is-lottery {
|
||||
color: var(--gold);
|
||||
}
|
||||
.j13-typed-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
.j13-typed-actions-row {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
.j13-typed-meta,
|
||||
.j13-typed-empty {
|
||||
margin: 8px 0 0;
|
||||
font-size: 12.5px;
|
||||
line-height: 1.5;
|
||||
color: var(--ink-3);
|
||||
}
|
||||
.j13-typed-foot {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 8px 16px;
|
||||
margin-top: 14px;
|
||||
padding-top: 12px;
|
||||
border-top: 1px solid var(--line);
|
||||
font-size: 12.5px;
|
||||
color: var(--ink-3);
|
||||
}
|
||||
.j13-typed-foot-status {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-weight: 550;
|
||||
}
|
||||
.j13-typed-foot-status svg {
|
||||
flex-shrink: 0;
|
||||
color: var(--ink-2);
|
||||
}
|
||||
.j13-typed-foot-time {
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.j13-bounty-points {
|
||||
font-weight: 700;
|
||||
color: var(--clay);
|
||||
}
|
||||
.j13-poll-options {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
margin: 12px 0 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
.j13-poll-option {
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
overflow: hidden;
|
||||
padding: 10px 12px;
|
||||
border-radius: 12px;
|
||||
border: 1px solid var(--line);
|
||||
background: var(--panel);
|
||||
transition: border-color 0.15s ease, background 0.15s ease;
|
||||
}
|
||||
.j13-poll-option:disabled {
|
||||
cursor: default;
|
||||
}
|
||||
.j13-poll-option:not(:disabled):hover {
|
||||
border-color: color-mix(in srgb, var(--accent) 35%, var(--line));
|
||||
}
|
||||
.j13-poll-option.is-on {
|
||||
border-color: var(--accent);
|
||||
background: var(--accent-soft);
|
||||
}
|
||||
.j13-poll-option-bar {
|
||||
position: absolute;
|
||||
inset: 0 auto 0 0;
|
||||
opacity: 0.28;
|
||||
background: var(--accent);
|
||||
pointer-events: none;
|
||||
}
|
||||
.j13-poll-option-row {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
}
|
||||
.j13-poll-option-text {
|
||||
font-size: 14px;
|
||||
color: var(--ink);
|
||||
}
|
||||
.j13-poll-option-stat {
|
||||
flex-shrink: 0;
|
||||
font-size: 12.5px;
|
||||
color: var(--ink-3);
|
||||
}
|
||||
.j13-poll-voters {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
margin: 6px 0 0;
|
||||
padding: 0 2px;
|
||||
list-style: none;
|
||||
}
|
||||
.j13-poll-voter {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 2px 8px 2px 3px;
|
||||
border-radius: 999px;
|
||||
font-size: 12px;
|
||||
background: var(--accent-soft);
|
||||
color: var(--accent);
|
||||
text-decoration: none;
|
||||
}
|
||||
.j13-poll-voter:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.j13-lottery-card {
|
||||
padding: 16px 18px 14px;
|
||||
}
|
||||
.j13-lottery-head {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 10px 14px;
|
||||
}
|
||||
.j13-lottery-head-main {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
min-width: 0;
|
||||
}
|
||||
.j13-lottery-title {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
margin: 0;
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.01em;
|
||||
color: var(--gold);
|
||||
}
|
||||
.j13-lottery-title svg {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.j13-lottery-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
.j13-lottery-meta,
|
||||
.j13-lottery-empty {
|
||||
margin: 8px 0 0;
|
||||
font-size: 12.5px;
|
||||
line-height: 1.5;
|
||||
color: var(--ink-3);
|
||||
}
|
||||
/* 截止倒计时：投票 / 悬赏 / 抽奖共用 */
|
||||
.j13-deadline-countdown {
|
||||
margin-top: 12px;
|
||||
padding: 12px 14px 11px;
|
||||
border-radius: 14px;
|
||||
border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--line));
|
||||
background: color-mix(in srgb, var(--accent-soft) 55%, var(--panel));
|
||||
}
|
||||
.j13-deadline-countdown.is-expired {
|
||||
border-color: color-mix(in srgb, var(--ink-3) 35%, var(--line));
|
||||
background: color-mix(in srgb, var(--tint) 70%, var(--panel));
|
||||
}
|
||||
.j13-deadline-countdown-label {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
margin: 0 0 8px;
|
||||
font-size: 12.5px;
|
||||
font-weight: 650;
|
||||
color: var(--accent);
|
||||
}
|
||||
.j13-deadline-countdown.is-expired .j13-deadline-countdown-label {
|
||||
color: var(--ink-2);
|
||||
}
|
||||
.j13-deadline-countdown-digits {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: flex-end;
|
||||
gap: 8px;
|
||||
}
|
||||
.j13-deadline-countdown-unit {
|
||||
display: inline-flex;
|
||||
align-items: baseline;
|
||||
gap: 4px;
|
||||
padding: 6px 10px 5px;
|
||||
border-radius: 10px;
|
||||
background: var(--panel);
|
||||
border: 1px solid var(--line);
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
.j13-deadline-countdown-unit.is-sec {
|
||||
border-color: color-mix(in srgb, var(--accent) 28%, var(--line));
|
||||
background: color-mix(in srgb, var(--accent-soft) 45%, var(--panel));
|
||||
}
|
||||
.j13-deadline-countdown-num {
|
||||
font-family: var(--font-mono);
|
||||
font-size: clamp(1.35rem, 3.2vw, 1.75rem);
|
||||
font-weight: 750;
|
||||
line-height: 1;
|
||||
letter-spacing: -0.02em;
|
||||
color: var(--ink);
|
||||
}
|
||||
.j13-deadline-countdown-suf {
|
||||
font-size: 12px;
|
||||
font-weight: 650;
|
||||
color: var(--ink-3);
|
||||
}
|
||||
.j13-deadline-countdown-unit.is-sec .j13-deadline-countdown-num {
|
||||
color: var(--accent);
|
||||
}
|
||||
.j13-deadline-countdown-expired {
|
||||
margin: 0;
|
||||
font-size: 1.15rem;
|
||||
font-weight: 750;
|
||||
letter-spacing: -0.01em;
|
||||
color: var(--ink);
|
||||
}
|
||||
.j13-deadline-countdown-ends {
|
||||
margin: 8px 0 0;
|
||||
font-size: 12px;
|
||||
color: var(--ink-3);
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.dark .j13-deadline-countdown-unit {
|
||||
background: var(--panel-2);
|
||||
box-shadow: none;
|
||||
}
|
||||
.j13-deadline-picker {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
.j13-deadline-picker-label {
|
||||
font-size: 13px;
|
||||
font-weight: 650;
|
||||
color: var(--ink);
|
||||
}
|
||||
.j13-deadline-picker-modes {
|
||||
display: inline-flex;
|
||||
gap: 4px;
|
||||
padding: 3px;
|
||||
border-radius: 10px;
|
||||
background: var(--tint);
|
||||
align-self: flex-start;
|
||||
}
|
||||
.j13-deadline-mode {
|
||||
border: 0;
|
||||
background: transparent;
|
||||
color: var(--ink-2);
|
||||
font-size: 12.5px;
|
||||
font-weight: 600;
|
||||
padding: 5px 10px;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.j13-deadline-mode.is-on {
|
||||
background: var(--panel);
|
||||
color: var(--ink);
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
.j13-deadline-mode:disabled {
|
||||
opacity: 0.55;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.j13-deadline-presets {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
.j13-deadline-custom {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
max-width: 22rem;
|
||||
}
|
||||
.j13-deadline-datetime {
|
||||
width: 100%;
|
||||
}
|
||||
/* 奖品 / 中奖者：横向排布，放不下换行 */
|
||||
.j13-lottery-prize-row,
|
||||
.j13-lottery-winner-row {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: stretch;
|
||||
gap: 8px 10px;
|
||||
margin: 12px 0 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
.j13-lottery-prize-row > li,
|
||||
.j13-lottery-winner-row > li {
|
||||
min-width: 0;
|
||||
}
|
||||
/* 奖品胶囊：淡金底 + 深金字 + 奖杯徽标 */
|
||||
.j13-lottery-prize-chip {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
max-width: min(100%, 28rem);
|
||||
padding: 6px 13px 6px 11px;
|
||||
border-radius: 999px;
|
||||
font-size: 13px;
|
||||
font-weight: 650;
|
||||
line-height: 1.25;
|
||||
background: var(--gold-soft);
|
||||
color: var(--gold);
|
||||
box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--gold) 28%, transparent);
|
||||
}
|
||||
.j13-lottery-prize-chip svg {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.j13-lottery-prize-chip-text {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.j13-lottery-prize-chip-count {
|
||||
margin-left: 0.3em;
|
||||
font-variant-numeric: tabular-nums;
|
||||
font-weight: 700;
|
||||
}
|
||||
.j13-lottery-winners-label {
|
||||
margin: 14px 0 0;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
color: var(--ink-3);
|
||||
}
|
||||
.j13-lottery-winner-row {
|
||||
margin-top: 8px;
|
||||
}
|
||||
/* 中奖者：横向胶囊卡片，内容定宽、可换行 */
|
||||
.j13-lottery-winner {
|
||||
display: grid;
|
||||
grid-template-columns: auto minmax(0, 1fr);
|
||||
align-items: center;
|
||||
column-gap: 10px;
|
||||
width: min(100%, 15.5rem);
|
||||
min-height: 52px;
|
||||
padding: 8px 14px 8px 8px;
|
||||
border-radius: 14px;
|
||||
border: 1px solid var(--line);
|
||||
background: var(--panel);
|
||||
box-shadow: var(--shadow-sm);
|
||||
}
|
||||
.j13-lottery-winner-avatar {
|
||||
grid-column: 1;
|
||||
}
|
||||
.j13-lottery-winner-body {
|
||||
grid-column: 2;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
min-width: 0;
|
||||
}
|
||||
.j13-lottery-winner-name {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 13px;
|
||||
font-weight: 650;
|
||||
line-height: 1.25;
|
||||
color: var(--ink);
|
||||
text-decoration: none;
|
||||
}
|
||||
.j13-lottery-winner-name:hover {
|
||||
color: var(--accent);
|
||||
}
|
||||
.j13-lottery-winner-prize {
|
||||
display: block;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 11.5px;
|
||||
font-weight: 600;
|
||||
color: var(--gold);
|
||||
}
|
||||
.dark .j13-lottery-winner {
|
||||
background: var(--panel-2);
|
||||
box-shadow: none;
|
||||
}
|
||||
.j13-lottery-foot {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 8px 16px;
|
||||
margin-top: 14px;
|
||||
padding-top: 12px;
|
||||
border-top: 1px solid var(--line);
|
||||
font-size: 12.5px;
|
||||
color: var(--ink-3);
|
||||
}
|
||||
.j13-lottery-foot-status {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-weight: 550;
|
||||
}
|
||||
.j13-lottery-foot-status svg {
|
||||
flex-shrink: 0;
|
||||
color: var(--ink-2);
|
||||
}
|
||||
.j13-lottery-foot-time {
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.j13-interact-card.is-unsolved {
|
||||
background: color-mix(in srgb, var(--danger) 7%, var(--panel));
|
||||
border-color: color-mix(in srgb, var(--danger) 22%, var(--line));
|
||||
@@ -303,51 +895,41 @@ body {
|
||||
border-color: color-mix(in srgb, var(--ok) 30%, var(--line));
|
||||
}
|
||||
|
||||
/* 正文下方已采纳答案：问答资料卡 */
|
||||
/* 正文下方已采纳答案：与类型帖 typed-card 同框，配色克制 */
|
||||
.j13-accepted-answer {
|
||||
margin-top: 1.75rem;
|
||||
padding: 1.15rem 1.25rem 1.25rem;
|
||||
border-radius: 14px;
|
||||
border: 1px solid color-mix(in srgb, var(--ok) 28%, var(--line));
|
||||
background: color-mix(in srgb, var(--ok) 7%, var(--panel));
|
||||
box-shadow: inset 3px 0 0 0 var(--ok);
|
||||
}
|
||||
.dark .j13-accepted-answer {
|
||||
background: color-mix(in srgb, var(--ok) 12%, var(--panel));
|
||||
border-color: color-mix(in srgb, var(--ok) 36%, var(--line));
|
||||
}
|
||||
.j13-accepted-answer__head {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 12px 16px;
|
||||
margin-bottom: 0.9rem;
|
||||
padding-bottom: 0.85rem;
|
||||
border-bottom: 1px solid color-mix(in srgb, var(--ok) 18%, var(--line));
|
||||
}
|
||||
.j13-accepted-answer__meta {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
min-width: 0;
|
||||
flex: 1;
|
||||
}
|
||||
.j13-accepted-answer__status {
|
||||
margin: 0;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
color: var(--ink);
|
||||
line-height: 1.3;
|
||||
.j13-accepted-answer.is-question,
|
||||
.j13-accepted-answer.is-bounty {
|
||||
/* 覆盖旧绿底/左边条；沿用 interact-card 面板 */
|
||||
border-color: var(--line);
|
||||
background: var(--panel);
|
||||
box-shadow: none;
|
||||
}
|
||||
.j13-accepted-answer__author {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
min-width: 0;
|
||||
margin-top: 12px;
|
||||
}
|
||||
.j13-accepted-answer__chip {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
flex-shrink: 0;
|
||||
padding: 3px 9px;
|
||||
border-radius: 999px;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
background: var(--ok-soft);
|
||||
color: var(--ok);
|
||||
}
|
||||
.j13-accepted-answer__body {
|
||||
min-width: 0;
|
||||
margin-top: 12px;
|
||||
padding-top: 12px;
|
||||
border-top: 1px solid var(--line);
|
||||
}
|
||||
/* 正文下方类型特殊块（投票/悬赏/抽奖/问答状态） */
|
||||
.j13-interact-below {
|
||||
@@ -382,6 +964,10 @@ body {
|
||||
opacity: 0.65;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.j13-compose-field-invalid {
|
||||
border-color: color-mix(in srgb, var(--danger) 55%, var(--line));
|
||||
box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 14%, transparent);
|
||||
}
|
||||
|
||||
.j13-compose-title {
|
||||
width: 100%;
|
||||
@@ -1129,18 +1715,11 @@ a.j13-mention-token:hover {
|
||||
background: color-mix(in srgb, #0284c7 12%, var(--panel));
|
||||
color: #0369a1;
|
||||
}
|
||||
/* 已结束 / 已过期 / 已开奖 / 已截止：统一灰胶囊（标识已到期） */
|
||||
.badge-status-closed {
|
||||
background: color-mix(in srgb, #5b6b8c 12%, var(--panel));
|
||||
color: #5b6b8c;
|
||||
}
|
||||
.badge-status-expired {
|
||||
background: color-mix(in srgb, var(--danger) 12%, var(--panel));
|
||||
color: var(--danger);
|
||||
}
|
||||
.badge-status-drawn {
|
||||
background: color-mix(in srgb, #7c5cbf 14%, var(--panel));
|
||||
color: #6a4aad;
|
||||
}
|
||||
.dark .badge-status-unsolved {
|
||||
background: rgba(255, 107, 96, 0.14);
|
||||
color: #fca5a5;
|
||||
@@ -1157,14 +1736,6 @@ a.j13-mention-token:hover {
|
||||
background: rgba(170, 182, 207, 0.14);
|
||||
color: #aab6cf;
|
||||
}
|
||||
.dark .badge-status-expired {
|
||||
background: color-mix(in srgb, var(--danger) 20%, transparent);
|
||||
color: var(--danger);
|
||||
}
|
||||
.dark .badge-status-drawn {
|
||||
background: rgba(192, 168, 245, 0.16);
|
||||
color: #c0a8f5;
|
||||
}
|
||||
|
||||
/* 评论区成就徽标：实心底，比类型/状态浅底更醒目 */
|
||||
.badge-accepted {
|
||||
|
||||
Reference in New Issue
Block a user