feat: hidden flag, description placeholders, drag handle contrast fix

- Unit and Group get hidden?: boolean — filtered server-side before render
- Hidden group also suppresses all its units from the converter
- New resolveDescription() utility in src/lib/description.ts
  supports {id}, {id:label}, {id:plural}, {id:symbol} placeholders
- ConverterCard pre-resolves descriptions and passes result to ConversionResult
- ConversionResult accepts description prop instead of reading unit.description
- Admin forms: Hidden checkbox added for both units and groups
- drag-handle color overridden to --pico-primary-inverse on selected/drag-over rows
  (white in light/dark themes, black on Dan Mode yellow)
This commit is contained in:
Falkan
2026-03-18 16:53:34 -04:00
parent 9d56d2ed46
commit 998cda0bb3
7 changed files with 101 additions and 5 deletions

View File

@@ -861,6 +861,10 @@
Description <small class="muted">(optional — shown as tooltip in converter)</small>
<textarea bind:value={unitForm.description} placeholder="e.g. A unit based on…" rows="2"></textarea>
</label>
<label class="checkbox-label">
<input type="checkbox" bind:checked={unitForm.hidden} />
Hidden <small class="muted">— exclude from converter rendering</small>
</label>
<div class="form-actions">
<button onclick={saveUnit}>{unitFormNew ? 'Create' : 'Save'}</button>
{#if !unitFormNew}
@@ -906,6 +910,10 @@
<option value="alpha">Alphabetical</option>
</select>
</label>
<label class="checkbox-label">
<input type="checkbox" bind:checked={groupForm.hidden} />
Hidden <small class="muted">— exclude group and all its units from converter rendering</small>
</label>
<div class="form-actions">
<button onclick={saveGroup}>{groupFormNew ? 'Create' : 'Save'}</button>
{#if !groupFormNew}
@@ -1219,6 +1227,19 @@
gap: 0.5rem;
margin-top: 1rem;
}
.checkbox-label {
display: flex;
align-items: center;
gap: 0.5rem;
cursor: pointer;
margin-bottom: 0.75rem;
}
.checkbox-label input[type=checkbox] {
flex-shrink: 0;
width: 1rem;
height: 1rem;
margin: 0;
}
.form-msg {
padding: 0.5rem 0.75rem;
border-radius: var(--pico-border-radius);
@@ -1289,6 +1310,12 @@
.drag-handle:active {
cursor: grabbing;
}
/* When the row has a primary-colored background, muted grey/orange disappears.
Force the handle to the primary inverse (white in normal themes, black in Dan). */
.tree-unit-row.selected .drag-handle,
.tree-unit-row.drag-over-unit .drag-handle {
color: var(--pico-primary-inverse);
}
.drag-over-unit {
border-top: 2px solid var(--pico-primary);
}