From a7ab6708ef4fe7ba133911e7132448821665ba14 Mon Sep 17 00:00:00 2001
From: "Tommy D. Rossi" <beats.by.morse@gmail.com>
Date: Fri, 20 Feb 2026 12:57:41 +0100
Subject: [PATCH] fix code block bleed alignment and line numbers

- Fixed --ll-bleed to 44px (8px padding + 36px line-number width, border-box)
- Line numbers fixed width 36px (always fits 3 digits, no layout shift)
- Line number opacity increased from 0.15 to 0.3 in both light and dark mode
- Commented out code block background
---
 website/src/components/markdown.tsx | 4 ++--
 website/src/styles/liveline.css     | 8 ++++----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/website/src/components/markdown.tsx b/website/src/components/markdown.tsx
index 0014a03..15d5152 100644
--- a/website/src/components/markdown.tsx
+++ b/website/src/components/markdown.tsx
@@ -363,7 +363,7 @@ export function CodeBlock({ children, lang = "jsx" }: { children: string; lang?:
         <pre
           className="overflow-x-auto"
           style={{
-            background: "var(--ll-code-bg)",
+            // background: "var(--ll-code-bg)",
             borderRadius: "8px",
             margin: 0,
             padding: 0,
@@ -389,7 +389,7 @@ export function CodeBlock({ children, lang = "jsx" }: { children: string; lang?:
                 color: "var(--ll-code-line-nr)",
                 textAlign: "right",
                 paddingRight: "20px",
-                minWidth: "28px",
+                width: "36px",
                 userSelect: "none",
               }}
             >
diff --git a/website/src/styles/liveline.css b/website/src/styles/liveline.css
index 92aa190..7d51870 100644
--- a/website/src/styles/liveline.css
+++ b/website/src/styles/liveline.css
@@ -40,8 +40,8 @@
     "SFMono-Regular", "Consolas", "Liberation Mono", Menlo, Courier, monospace;
 
   /* Bleed: code blocks & images extend beyond prose column.
-     36px = 8px div padding-left + 28px line-number span (border-box includes its 20px paddingRight) */
-  --ll-bleed: 36px;
+     44px = 8px div padding-left + 36px line-number width (border-box, includes 20px paddingRight) */
+  --ll-bleed: 44px;
 
   /* Spacing scale */
   --ll-spacing-xxs: 0.5rem;
@@ -70,7 +70,7 @@
   --ll-border: #e3e3e3;
   --ll-divider: rgb(242, 242, 242);
   --ll-code-bg: rgba(0, 0, 0, 0.02);
-  --ll-code-line-nr: rgba(0, 0, 0, 0.15);
+  --ll-code-line-nr: rgba(0, 0, 0, 0.3);
   --ll-selection-bg: rgba(0, 0, 0, 0.08);
 
   /* Button / back button */
@@ -125,7 +125,7 @@
   --ll-border: rgba(255, 255, 255, 0.1);
   --ll-divider: rgba(255, 255, 255, 0.06);
   --ll-code-bg: rgba(255, 255, 255, 0.05);
-  --ll-code-line-nr: rgba(255, 255, 255, 0.15);
+  --ll-code-line-nr: rgba(255, 255, 255, 0.3);
   --ll-selection-bg: rgba(255, 255, 255, 0.1);
 
   --ll-btn-bg: rgb(30, 30, 30);