From 6a5aa007010f90141199f3a4eb14ab85105ddac7 Mon Sep 17 00:00:00 2001
From: Jake Leahy <jake@leahy.dev>
Date: Mon, 9 Sep 2024 17:42:45 +1000
Subject: [PATCH] Fix CSS for `number-lines` code blocks (#24081)

Adds a few fixes for when using code blocks with lines numbered

- Use CSS variables for the colours so that it works in dark mode
- Don't turn on normal table effects like hover and smaller font when
its a line number table
- With dochack.nim, don't add a clipboard copy button for the line
numbers at the side

[Example page showing the
changes](https://66dcde6e4a655efb70771d9a--dazzling-kitten-6c3419.netlify.app/)
---
 doc/nimdoc.css                             | 9 ++++++---
 nimdoc/testproject/expected/nimdoc.out.css | 9 ++++++---
 tools/dochack/dochack.nim                  | 4 ++--
 3 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/doc/nimdoc.css b/doc/nimdoc.css
index a9e4ac9c6a..0c399e4c19 100644
--- a/doc/nimdoc.css
+++ b/doc/nimdoc.css
@@ -623,8 +623,8 @@ pre {
 
 table.line-nums-table {
   border-radius: 4px;
-  border: 1px solid #cccccc;
-  background-color: ghostwhite;
+  border: 1px solid var(--border);
+  background-color: var(--secondary-background);
   border-collapse: separate;
   margin-top: 15px;
   margin-bottom: 25px; }
@@ -660,6 +660,9 @@ table {
   border-collapse: collapse;
   border-color: var(--third-background);
   border-spacing: 0;
+}
+
+table:not(.line-nums-table) {
   font-size: 0.9em;
 }
 
@@ -678,7 +681,7 @@ table th.docinfo-name {
   text-align: right;
 }
 
-table tr:hover {
+table:not(.line-nums-table) tr:hover {
   background-color: var(--third-background); }
 
 
diff --git a/nimdoc/testproject/expected/nimdoc.out.css b/nimdoc/testproject/expected/nimdoc.out.css
index a9e4ac9c6a..0c399e4c19 100644
--- a/nimdoc/testproject/expected/nimdoc.out.css
+++ b/nimdoc/testproject/expected/nimdoc.out.css
@@ -623,8 +623,8 @@ pre {
 
 table.line-nums-table {
   border-radius: 4px;
-  border: 1px solid #cccccc;
-  background-color: ghostwhite;
+  border: 1px solid var(--border);
+  background-color: var(--secondary-background);
   border-collapse: separate;
   margin-top: 15px;
   margin-bottom: 25px; }
@@ -660,6 +660,9 @@ table {
   border-collapse: collapse;
   border-color: var(--third-background);
   border-spacing: 0;
+}
+
+table:not(.line-nums-table) {
   font-size: 0.9em;
 }
 
@@ -678,7 +681,7 @@ table th.docinfo-name {
   text-align: right;
 }
 
-table tr:hover {
+table:not(.line-nums-table) tr:hover {
   background-color: var(--third-background); }
 
 
diff --git a/tools/dochack/dochack.nim b/tools/dochack/dochack.nim
index 0753248bc3..9469453463 100644
--- a/tools/dochack/dochack.nim
+++ b/tools/dochack/dochack.nim
@@ -328,8 +328,8 @@ proc copyToClipboard*() {.exportc.} =
 
     function updatePreTags() {
 
-      const allPreTags = document.querySelectorAll("pre")
-    
+      const allPreTags = document.querySelectorAll("pre:not(.line-nums)")
+
       allPreTags.forEach((e) => {
       
           const div = document.createElement("div")