Many UX and correctness improvements

- Components URL reflects selected component (/components/:id), survives refresh
- Word-split search: "0603 res" matches "Resistor 0603"
- Left pane resizable with localStorage persistence
- Field values rendered via central render_field_value() (units, URLs, extensible)
- Fields sorted alphabetically in both detail view and edit dialog
- Edit component dialog widened; field rows use shared grid columns (table-like)
- No space between value and unit (supports prefix suffixes like k, M, µ)
- Grid viewer highlights and scrolls to cell when navigating from component detail
- Cell inventory overlay items are <a> tags — middle-click opens in new tab
- PDF files stored with sanitized human-readable filename, not random ID
- PDF rename also renames file on disk
- Atomic rename via renameat2(RENAME_NOREPLACE) through tools/mv-sync
- Fix .cell-thumb-link → .cell-thumb-preview (div, not anchor), cursor: zoom-in
- Fix field name overflow in detail view (auto column width, overflow-wrap)
- Fix link color: use --accent instead of browser default dark blue

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-22 02:49:11 +00:00
parent 7ef5bb5381
commit 58c93f2bd0
7 changed files with 233 additions and 51 deletions

View File

@@ -2,11 +2,12 @@
<template id="t-section-components">
<section class="section" id="section-components">
<div class="split-layout">
<div class="list-pane">
<div class="list-pane" id="list-pane">
<input type="search" id="component-search" class="search-input" placeholder="Search…">
<input type="text" id="quick-add" class="quick-add-input" placeholder="New component… ↵" autocomplete="off" spellcheck="false">
<div id="component-list" class="component-list"></div>
</div>
<div class="split-resizer" id="split-resizer"></div>
<div class="detail-pane" id="detail-pane"></div>
</div>
</section>
@@ -383,7 +384,7 @@
<!-- ===== DIALOG: COMPONENT ===== -->
<template id="t-dialog-component">
<dialog id="dialog-component" class="app-dialog">
<dialog id="dialog-component" class="app-dialog app-dialog-wide">
<h2 class="dialog-title"></h2>
<form method="dialog" id="form-component">
<div class="form-row">