mtfyun/reader
1
0 Fork 0
mirror of https://github.com/hectorqin/reader.git synced 2026-11-12 05:50:54 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(web): style the source list sheet's search input

Browse Source 
Since the React migration the input itself carries .catalog-source-search,
but the rules still targeted `.catalog-source-search input` from the old
label wrapper. The field fell back to the browser's inset box at 15px,
and the leftover `flex: 1 1 16rem` made it 256px tall in the sheet's
column layout. Style the input directly at 16px and drop the dead
.catalog-source-meta rules.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
hectorqinandClaude Opus 5.5 committed 2026-10-29 02:55:24 +00:00
1 parent c8dba91c6d
commit 03bb3e753a
1 file changed
+5 -5
Download Patch File Download Diff File Expand all files Collapse all files
web/src/styles/reader.css
+5 -5
View File
@@ -4129,11 +4129,11 @@ svg.icon { display: inline-block; width: 1em; height: 1em; flex-shrink: 0; verti
.search-menu button > .icon { width:2rem; height:2rem; display:grid; place-items:center; }
.search-menu button > span { min-width:0; line-height:1.35; }
.search-menu small { line-height:1.4; }
.catalog-source-meta { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:.75rem; }
.catalog-source-search { display:block; flex:1 1 16rem; max-width:22rem; }
.catalog-source-search input { width:100%; min-height:42px; box-sizing:border-box; padding:.6rem .8rem; border:1px solid var(--reader-line); border-radius:var(--radius-md); background:var(--reader-paper); color:var(--reader-ink); }
.catalog-source-search input:focus { border-color:var(--reader-accent); outline:2px solid color-mix(in srgb,var(--reader-accent) 25%,transparent); outline-offset:1px; }
@media (max-width:600px) { .catalog-source-meta { align-items:stretch; flex-direction:column; gap:.55rem; } .catalog-source-search { max-width:none; } }
/* The class is on the sheet's <input> itself; a 16px font keeps iOS from zooming on focus. */
.catalog-source-search { display:block; flex:none; width:100%; min-height:44px; box-sizing:border-box; padding:.6rem .8rem; border:1px solid var(--reader-line); border-radius:var(--radius-md); background:var(--reader-paper); color:var(--reader-ink); font:inherit; font-size:var(--text-title); }
.catalog-source-search:focus { border-color:var(--reader-accent); outline:2px solid color-mix(in srgb,var(--reader-accent) 25%,transparent); outline-offset:1px; }
.catalog-source-search::placeholder { color:color-mix(in srgb,var(--reader-muted) 85%,transparent); }
.catalog-source-search::-webkit-search-cancel-button, .catalog-source-search::-webkit-search-decoration { appearance:none; display:none; }
/* ---- 书架: 在读 / 想读 / 已读 and 分组 (prototypes 2 and 19) ----
* One row of chips above the toolbar; the selected one is brand-soft with brand