Wave 2: form cleanups from the site comments, plus localization, project switcher and global search
Site comments (8/3) - BIM card: LOD removed, IFF # added next to the coordination status, and required once that status is "Signed off (IFF)" — an unnumbered sign-off isn't traceable. A LOD already stored on a package is preserved and shown as legacy, not blanked. - The blue "from SOP types" subtext under a field is now a SOP chip on the label with the detail in a tooltip. The chip stays visible rather than hover-only: field tablets have no hover, and "this came from the SOP" is the part that matters. The hint elements stay in the DOM (hidden) so the code writing to them keeps working; an observer mirrors their text into the tooltip. - Specification Section is no longer typed per package. Each WP type carries a spec section on the SOP; the field is read-only in the Creator and follows the type, with the SOP's spec folder linked underneath. This reads both spec comments as one intent — stop typing it, derive it. - Assignees and Distribution are multi-selects over the SOP project team, showing each person's job function, with the CM pre-added to Distribution (removable per package) and a free-text option for people with no account. The stored display strings are unchanged so print/export/dashboard keep working; account ids ride alongside for the notification work in wave 3. Localization + time - Per-user locale/timezone (Language & time in the user menu), an app-wide default in the admin console, then the browser. Timezones are validated against the server's zoneinfo and the picker is fed from it. Calendar dates are formatted from their parts so a due date never reads a day early in another zone. - Every displayed timestamp now goes through the shared helpers. Top-bar chrome - Project switcher beside the logo and a centered global search, injected into either generation of top bar; skipped in an iframe so the embedded Creator doesn't get a second one. Ctrl/Cmd-K focuses search. - GET /api/search covers work packages, projects and SOPs, scoped to the caller's projects, hiding archived packages, with LIKE wildcards escaped. Fixed along the way: showForm() cleared every card's inline display, which undid applyKind() — so the Package Type and BIM cards reappeared on an install-only project. Split out applyKindVisibility() and re-apply it there. Verified: 100 API checks on a fresh database (44 permissions + 22 password reset + 34 search/localization), 24 driven UI checks against the real Creator page in headless Chrome (SOP chips, both people pickers, spec auto-fill, critical tags, BIM suppression), and the chrome harness on both bar styles. Screenshots reviewed. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -631,6 +631,59 @@
|
||||
.wp-nav-reopen { display:none !important; }
|
||||
}
|
||||
|
||||
/* ── SOP-inherited marker ───────────────────────────────────────────────────
|
||||
The "from SOP types" subtext used to sit under the field. It's now a small
|
||||
chip on the label with the detail in a hover tooltip (site comment 8/3).
|
||||
The chip stays VISIBLE rather than hover-only: on a field tablet there is no
|
||||
hover, and "this value came from the SOP" is the part people need to see. */
|
||||
.field-hint.sop-hint { display: none; }
|
||||
.sop-chip { display:inline-block; margin-left:6px; padding:0 6px; border-radius:9px;
|
||||
background:var(--accent-dim); color:var(--accent); border:1px solid #b9d2fb;
|
||||
font-size:9.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
|
||||
vertical-align:middle; cursor:help; position:relative; }
|
||||
.sop-chip::after { content:attr(data-tip); position:absolute; bottom:135%; left:50%;
|
||||
transform:translateX(-50%); background:#161616; color:#fff; padding:7px 10px; font-size:12px;
|
||||
font-weight:400; letter-spacing:0; text-transform:none; line-height:1.4; white-space:normal;
|
||||
width:max-content; max-width:260px; text-align:left; z-index:9999; opacity:0;
|
||||
pointer-events:none; transition:opacity .12s; box-shadow:0 4px 14px rgba(20,30,50,.22); }
|
||||
.sop-chip::before { content:''; position:absolute; bottom:135%; left:50%;
|
||||
transform:translate(-50%,95%); border:5px solid transparent; border-top-color:#161616;
|
||||
opacity:0; transition:opacity .12s; z-index:9999; }
|
||||
.sop-chip:hover::after, .sop-chip:hover::before,
|
||||
.sop-chip:focus::after, .sop-chip:focus::before { opacity:1; }
|
||||
|
||||
/* ── people picker (Assignees / Distribution) ───────────────────────────────
|
||||
Multi-select over the SOP project team instead of a free-text list. */
|
||||
.people-pick { border:1px solid var(--border-strong); border-radius:4px; background:var(--surface);
|
||||
padding:5px 6px; min-height:38px; display:flex; flex-wrap:wrap; gap:5px; align-items:center; }
|
||||
.people-pick:focus-within { outline:2px solid var(--accent); outline-offset:-2px; }
|
||||
.pp-chip { display:inline-flex; align-items:center; gap:5px; padding:2px 6px 2px 8px;
|
||||
background:var(--surface2); border:1px solid var(--border); border-radius:12px;
|
||||
font-size:12px; max-width:100%; }
|
||||
.pp-chip.pp-locked { background:var(--accent-dim); border-color:#b9d2fb; color:var(--accent); }
|
||||
.pp-chip .pp-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
|
||||
.pp-chip .pp-x { background:none; border:0; cursor:pointer; color:var(--text-muted);
|
||||
font-size:12px; line-height:1; padding:0 1px; }
|
||||
.pp-chip .pp-x:hover { color:var(--red); }
|
||||
.pp-add { position:relative; }
|
||||
.pp-add-btn { background:none; border:1px dashed var(--border-strong); border-radius:12px;
|
||||
color:var(--text-muted); font:inherit; font-size:12px; padding:2px 9px; cursor:pointer; }
|
||||
.pp-add-btn:hover { border-color:var(--accent); color:var(--accent); }
|
||||
.pp-menu { position:absolute; top:calc(100% + 4px); left:0; z-index:60; min-width:270px;
|
||||
max-height:300px; overflow-y:auto; background:var(--surface); border:1px solid var(--border-strong);
|
||||
box-shadow:0 8px 24px rgba(20,30,50,.18); border-radius:4px; padding:6px 0; }
|
||||
.pp-menu[hidden] { display:none; }
|
||||
.pp-group { font-size:9.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
|
||||
color:var(--text-dim); padding:7px 10px 3px; }
|
||||
.pp-opt { display:flex; align-items:center; gap:8px; padding:5px 10px; font-size:13px; cursor:pointer; }
|
||||
.pp-opt:hover { background:var(--surface2); }
|
||||
.pp-opt input { width:15px; height:15px; cursor:pointer; }
|
||||
.pp-opt .pp-role { color:var(--text-dim); font-size:11.5px; }
|
||||
.pp-free { border-top:1px solid var(--border); margin-top:5px; padding:7px 10px 3px; }
|
||||
.pp-free input { width:100%; padding:5px 7px; font:inherit; font-size:12.5px;
|
||||
border:1px solid var(--border); border-radius:3px; }
|
||||
.pp-free .field-hint { margin-top:4px; }
|
||||
|
||||
/* Critical constraint marker (from the SOP) */
|
||||
.crit-tag { display:inline-block; margin-left:6px; padding:1px 7px; border-radius:10px; font-size:10px;
|
||||
font-weight:700; letter-spacing:.02em; color:var(--red); background:var(--red-dim);
|
||||
|
||||
Reference in New Issue
Block a user