[giang17]

Linked issue

Closes #1310

What this changes

• New tagColorToCss() in src/color.js: wraps the tag color in a relative color, oklch(from <color> clamp(var(--grampsjs-tag-lightness-min, 0), l, var(--grampsjs-tag-lightness-max, 1)) c h / alpha). Hue and chroma stay as they are, only the lightness is limited.
• global.css sets --grampsjs-tag-lightness-min: 0.7 for the dark theme. The light theme defines no limits, so its tag colors are unchanged.
• The tags manager, the tag chips on object pages and the tag chips in the media list use tagColorToCss() instead of colorToCss() for text, outline and background tint.
• Browsers without relative color syntax (checked with CSS.supports) get the plain color as before.

With this, the default tag color black is shown as light grey on the dark theme; a red tag stays red with lightness 0.7 instead of 0.65.

How it was tested

• test/unit/color.test.js: 4 new tests for tagColorToCss() (with and without relative color support, without CSS, invalid color). npm run lint and npm test (63 files, 1180 tests) pass.
• Dev container with the example tree plus a temporary tag "Blog" with the Gramps default color #000000000000, Chromium 152, dark theme: in Administration → Tags the computed color of "Blog" is oklch(0.7 0 0 / 0.9) instead of black. On the light theme the computed colors of all three tags are unchanged (oklch(0 0 0 / 0.9) for "Blog"). The "ToDo" chip on person I0044 is clamped the same way on the dark theme.

Before / after on the dark theme:

Drafted with an AI assistant.

---

• I have read CONTRIBUTING.md
• This was discussed in an issue first, or it is small enough not to need one
• I wrote this myself, or used an AI assistant and have reviewed every line

[DavidMStraub]

Thanks!