From d9489a5db28beb9c3c999bf29207ed2bb390af76 Mon Sep 17 00:00:00 2001
From: Falkan <falkan@openclaw.local>
Date: Mon, 16 Mar 2026 22:07:37 -0400
Subject: [PATCH] Simplify: token-ify hardcoded colors, remove redundant Big
 ternary, guard no-op shift-click
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Replace 5 hardcoded #2C2C2C/#555550/#888880 literals with var(--pico-color),
  var(--color-label), var(--pico-muted-color); add --color-label token to :root
- Remove inline Big(inputValue) ternary in results derived — convert.ts already
  handles same-unit identity via its own from.id === to.id guard
- Drop now-unused Big import from +page.svelte
- Guard onshiftclick in ConversionResult: no-op when tile is already the from-unit

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/app.css                            | 13 +++++++------
 src/components/ConversionResult.svelte |  4 +++-
 src/routes/+page.svelte                |  8 +++-----
 3 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/src/app.css b/src/app.css
index 606d08a..d606852 100644
--- a/src/app.css
+++ b/src/app.css
@@ -11,6 +11,7 @@
   --pico-card-border-color: #E8E4DF;
   --pico-color: #2C2C2C;
   --pico-muted-color: #888880;
+  --color-label: #555550; /* mid-muted: darker than muted-color, lighter than body text */
   --pico-muted-border-color: #E0DCD7;
   --pico-primary: #5B7FA6;
   --pico-primary-background: rgba(91, 127, 166, 0.08);
@@ -68,17 +69,17 @@
   font-weight: 600;
   font-variant-numeric: tabular-nums;
   word-break: break-all;
-  color: #2C2C2C; /* explicit dark charcoal, do not rely on inheritance */
+  color: var(--pico-color); /* explicit; do not rely on inheritance */
 }
 
 .result-label {
   font-size: 0.85rem;
-  color: #555550;
+  color: var(--color-label);
 }
 
 .result-symbol {
   font-size: 0.75rem;
-  color: #888880;
+  color: var(--pico-muted-color);
   font-style: italic;
 }
 
@@ -104,12 +105,12 @@
   font-variant-numeric: tabular-nums;
   line-height: 1.1;
   word-break: break-all;
-  color: #2C2C2C;
+  color: var(--pico-color);
 }
 
 .highlighted-label {
   font-size: 1.25rem;
-  color: #2C2C2C;
+  color: var(--pico-color);
 }
 
 .highlighted-symbol {
@@ -160,7 +161,7 @@
 }
 
 .highlight-dismiss:hover {
-  color: #2C2C2C;
+  color: var(--pico-color);
   background-color: rgba(0, 0, 0, 0.06);
 }
 
diff --git a/src/components/ConversionResult.svelte b/src/components/ConversionResult.svelte
index 6286085..d45afeb 100644
--- a/src/components/ConversionResult.svelte
+++ b/src/components/ConversionResult.svelte
@@ -29,7 +29,9 @@
 
   function handleClick(e: MouseEvent) {
     if (e.shiftKey) {
-      onshiftclick();
+      // Shift+click promotes this tile to the from-unit.
+      // Guard: if it already IS the from-unit, the action would be a no-op.
+      if (!isInputUnit) onshiftclick();
     } else {
       onclick();
     }
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index fcc2f96..c266491 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -2,7 +2,6 @@
   import { browser } from '$app/environment';
   import { goto } from '$app/navigation';
   import { page } from '$app/state';
-  import { Big } from 'big.js';
   import { florpUnits } from '$lib/units/definitions';
   import { convertById } from '$lib/convert';
   import { FRACTIONAL_DIGITS } from '$lib/config';
@@ -43,13 +42,12 @@
   }
 
   // ── Derived: results for ALL units in definition order ─────────────────────
+  // convert.ts already handles the same-unit identity (from.id === to.id → return value),
+  // so no special-casing needed here for the from-unit.
   let results = $derived<ResultItem[]>(
     units.map((u) => ({
       unit: u,
-      convertedValue:
-        u.id === fromUnitId
-          ? Big(inputValue) // from-unit always equals inputValue
-          : convertById(inputValue, fromUnitId, u.id, units)
+      convertedValue: convertById(inputValue, fromUnitId, u.id, units)
     }))
   );