From 9f9c525df84b9053ad91179ac66b7f9629de5001 Mon Sep 17 00:00:00 2001 From: Jorge Manrubia Date: Thu, 19 Mar 2026 18:37:20 +0100 Subject: [PATCH] Fix invisible inline code background in dark theme The code element background used var(--color-canvas), which in dark mode resolves to the same color as the page background, making inline code elements invisible. Switch to var(--color-ink-lighter) for the background and var(--color-ink-light) for the border so inline code is visually distinguishable. Fixes Fizzy card #5003 --- app/assets/stylesheets/cards.css | 4 ++-- app/assets/stylesheets/lexxy.css | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/app/assets/stylesheets/cards.css b/app/assets/stylesheets/cards.css index 76f08fdc5d..7537f45865 100644 --- a/app/assets/stylesheets/cards.css +++ b/app/assets/stylesheets/cards.css @@ -226,8 +226,8 @@ } code { - background-color: var(--color-canvas); - border: 1px solid var(--color-ink-lighter); + background-color: var(--color-ink-lighter); + border: 1px solid var(--color-ink-light); border-radius: 0.25ch; font-family: var(--font-mono); font-size: smaller; diff --git a/app/assets/stylesheets/lexxy.css b/app/assets/stylesheets/lexxy.css index 053f626a9f..ecfd96fd77 100644 --- a/app/assets/stylesheets/lexxy.css +++ b/app/assets/stylesheets/lexxy.css @@ -156,8 +156,8 @@ } code { - background: var(--color-canvas); - border: 1px solid var(--color-ink-lighter); + background: var(--color-ink-lighter); + border: 1px solid var(--color-ink-light); } .horizontal-divider {