Files
kate522andClaude Opus 5 f80ca1e27d fix(widgets): restore single-card reference UI for search and quote widgets
The 搜索框 and 一言 sidebar widgets fell into the generic renderer branch, so
they rendered a .jio-panel card wrapping a second bespoke card
(.jio-widget-search / .jio-widget-quote). In-article 一言 also used
divergent modifier classes and an extra hover rule.

- search: render through the shared jio_get_search_box() (legacy keyword,
  history and category pickers) inside one reference card, mirroring the
  reference widget's markup and title default 「搜索」
- quote: render the reference .yiyan-box card itself as the click root; the
  shell now emits only the reference widget-container/title wrapper
- article 一言: adopt the reference class lists for header, footer and the
  standalone after-article box; drop the invented yiyan--* modifiers and
  the duplicate hover/opacity rules
- client: fill .cn/.en in the reference order (first line .cn, second .en)
  and drop the stale window.JioYiyan bridge plus the dead qv-yiyan.php AJAX
  path in runtime main.js
- schema: replace the ad-hoc search_style radio with the reference switches
  (keywords, history, input category, more_cats) and default title
- assets: enqueue assets/js/yiyan.js through the quote widget's asset list

Tests: widget-system suite 820/821 (the one failure is the pre-existing
frontend-lifecycle theme-init stub); new search/quote card contracts pass.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
2026-11-03 15:56:52 +08:00

109 lines
2.8 KiB
CSS

/* ---- Front / After content insertion ---- */
.article-front-content,
.article-after-content {
padding: 12px 0;
font-size: 14px;
line-height: 1.8;
color: var(--text-secondary, #666);
border-bottom: 1px dashed var(--border-color, #eee);
margin-bottom: 12px;
}
.article-after-content {
border-bottom: none;
border-top: 1px dashed var(--border-color, #eee);
margin-bottom: 0;
margin-top: 12px;
}
/* ---- Hidden Content Shortcodes ---- */
.jio-hidden-content {
position: relative;
margin: 16px 0;
padding: 16px;
border-radius: var(--border-radius, 8px);
font-size: 14px;
line-height: 1.8;
}
.jio-hidden-content--unlocked {
background: var(--bg-secondary, #f8f9fa);
border: 1px solid var(--border-color, #e5e7eb);
}
.jio-hidden-content--locked {
background: linear-gradient(135deg, var(--bg-secondary, #f8f9fa) 0%, var(--bg-tertiary, #f1f3f5) 100%);
border: 1px dashed var(--border-color, #d1d5db);
text-align: center;
padding: 24px 16px;
}
.jio-hidden-content__message {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
font-size: 15px;
color: var(--text-secondary, #6b7280);
margin-bottom: 12px;
}
.jio-hidden-content__message i {
font-size: 18px;
color: var(--text-muted, #9ca3af);
}
.jio-hidden-content--vip .jio-hidden-content__message i {
color: var(--vip-color, #f59e0b);
}
.jio-hidden-content--payshow .jio-hidden-content__message i {
color: var(--primary-color, #3b82f6);
}
.jio-hidden-content__form {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
margin-top: 8px;
}
.jio-hidden-content__password-input {
width: 200px;
max-width: 60%;
padding: 6px 12px;
border: 1px solid var(--border-color, #d1d5db);
border-radius: var(--border-radius, 6px);
font-size: 14px;
background: var(--bg-primary, #fff);
color: var(--text-primary, #1f2937);
outline: none;
transition: border-color .2s;
}
.jio-hidden-content__password-input:focus {
border-color: var(--primary-color, #3b82f6);
}
.jio-hidden-content__submit-btn,
.jio-hidden-content__login-btn {
display: inline-flex;
align-items: center;
gap: 4px;
padding: 6px 16px;
font-size: 13px;
border-radius: var(--border-radius, 6px);
cursor: pointer;
text-decoration: none;
transition: opacity .2s;
}
.jio-hidden-content__submit-btn:hover,
.jio-hidden-content__login-btn:hover {
opacity: .85;
}
.jio-paywall-preview { margin: 0 0 16px; padding: 14px 16px; border-left: 3px solid var(--color-primary, #f04494); background: var(--surface-2, #f8fafc); border-radius: 0 10px 10px 0; color: var(--color-ink-2, #374151); line-height: 1.7; }
.jio-paywall-preview p:last-child { margin-bottom: 0; }