fix: checkbox alignment, wording, and Dan Mode drag handle contrast
This commit is contained in:
@@ -1,13 +1,5 @@
|
|||||||
{
|
{
|
||||||
"units": [
|
"units": [
|
||||||
{
|
|
||||||
"id": "dickload",
|
|
||||||
"label": "Dickload",
|
|
||||||
"labelPlural": "Dickloads",
|
|
||||||
"symbol": "dl",
|
|
||||||
"group": "dickloads",
|
|
||||||
"toBase": 1
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
"id": "pound",
|
"id": "pound",
|
||||||
"label": "Pound",
|
"label": "Pound",
|
||||||
@@ -16,6 +8,14 @@
|
|||||||
"group": "dickloads",
|
"group": "dickloads",
|
||||||
"toBase": 0.038
|
"toBase": 0.038
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"id": "dickload",
|
||||||
|
"label": "Dickload",
|
||||||
|
"labelPlural": "Dickloads",
|
||||||
|
"symbol": "dl",
|
||||||
|
"group": "dickloads",
|
||||||
|
"toBase": 1
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"id": "barrel",
|
"id": "barrel",
|
||||||
"label": "Barrel",
|
"label": "Barrel",
|
||||||
|
|||||||
@@ -863,7 +863,7 @@
|
|||||||
</label>
|
</label>
|
||||||
<label class="checkbox-label">
|
<label class="checkbox-label">
|
||||||
<input type="checkbox" bind:checked={unitForm.hidden} />
|
<input type="checkbox" bind:checked={unitForm.hidden} />
|
||||||
Hidden <small class="muted">— exclude from converter rendering</small>
|
<span>Don't show on front end</span>
|
||||||
</label>
|
</label>
|
||||||
<div class="form-actions">
|
<div class="form-actions">
|
||||||
<button onclick={saveUnit}>{unitFormNew ? 'Create' : 'Save'}</button>
|
<button onclick={saveUnit}>{unitFormNew ? 'Create' : 'Save'}</button>
|
||||||
@@ -912,7 +912,7 @@
|
|||||||
</label>
|
</label>
|
||||||
<label class="checkbox-label">
|
<label class="checkbox-label">
|
||||||
<input type="checkbox" bind:checked={groupForm.hidden} />
|
<input type="checkbox" bind:checked={groupForm.hidden} />
|
||||||
Hidden <small class="muted">— exclude group and all its units from converter rendering</small>
|
<span>Don't show on front end</span>
|
||||||
</label>
|
</label>
|
||||||
<div class="form-actions">
|
<div class="form-actions">
|
||||||
<button onclick={saveGroup}>{groupFormNew ? 'Create' : 'Save'}</button>
|
<button onclick={saveGroup}>{groupFormNew ? 'Create' : 'Save'}</button>
|
||||||
@@ -1239,6 +1239,9 @@
|
|||||||
width: 1rem;
|
width: 1rem;
|
||||||
height: 1rem;
|
height: 1rem;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
/* Pico adds margin-top to checkboxes — override so flex centering works */
|
||||||
|
margin-top: 0 !important;
|
||||||
|
margin-bottom: 0 !important;
|
||||||
}
|
}
|
||||||
.form-msg {
|
.form-msg {
|
||||||
padding: 0.5rem 0.75rem;
|
padding: 0.5rem 0.75rem;
|
||||||
@@ -1300,21 +1303,36 @@
|
|||||||
}
|
}
|
||||||
.drag-handle {
|
.drag-handle {
|
||||||
cursor: grab;
|
cursor: grab;
|
||||||
color: var(--pico-muted-color);
|
color: var(--pico-color);
|
||||||
|
opacity: 0.35;
|
||||||
font-size: 0.9rem;
|
font-size: 0.9rem;
|
||||||
padding: 0 0.1rem;
|
padding: 0 0.1rem;
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
}
|
}
|
||||||
|
.drag-handle:hover {
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
.drag-handle:active {
|
.drag-handle:active {
|
||||||
cursor: grabbing;
|
cursor: grabbing;
|
||||||
|
opacity: 1;
|
||||||
}
|
}
|
||||||
/* When the row has a primary-colored background, muted grey/orange disappears.
|
/* On selected/drag-over rows the background changes — boost opacity so dots stay visible. */
|
||||||
Force the handle to the primary inverse (white in normal themes, black in Dan). */
|
|
||||||
.tree-unit-row.selected .drag-handle,
|
.tree-unit-row.selected .drag-handle,
|
||||||
.tree-unit-row.drag-over-unit .drag-handle {
|
.tree-unit-row.drag-over-unit .drag-handle {
|
||||||
color: var(--pico-primary-inverse);
|
color: var(--pico-primary-inverse);
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
/* Dan Mode: handle is magenta at full blast; black on yellow selected rows. */
|
||||||
|
:global([data-theme=dan]) .drag-handle {
|
||||||
|
color: #ff00ff;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
:global([data-theme=dan]) .tree-unit-row.selected .drag-handle,
|
||||||
|
:global([data-theme=dan]) .tree-unit-row.drag-over-unit .drag-handle {
|
||||||
|
color: #000000;
|
||||||
|
opacity: 1;
|
||||||
}
|
}
|
||||||
.drag-over-unit {
|
.drag-over-unit {
|
||||||
border-top: 2px solid var(--pico-primary);
|
border-top: 2px solid var(--pico-primary);
|
||||||
|
|||||||
Reference in New Issue
Block a user