From d755e77c448b77efdbf9e6e810ceb0442d36a0e0 Mon Sep 17 00:00:00 2001
From: FragginWagon <greg.r.jacobs@gmail.com>
Date: Thu, 29 Jan 2026 04:56:48 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20Ensure=20transparent=20backgroun?=
 =?UTF-8?q?ds=20for=20all=20syntax=20highlighting=20elements=20in=20both?=
 =?UTF-8?q?=20light=20and=20dark=20modes?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/views/GamemasterExplorer.vue          | 20 +++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/code/websites/pokedex.online/src/views/GamemasterExplorer.vue b/code/websites/pokedex.online/src/views/GamemasterExplorer.vue
index 9b5d781..758ca9c 100644
--- a/code/websites/pokedex.online/src/views/GamemasterExplorer.vue
+++ b/code/websites/pokedex.online/src/views/GamemasterExplorer.vue
@@ -692,6 +692,15 @@ onMounted(async () => {
   padding: 0 !important;
 }
 
+/* Override ALL possible highlight.js classes with transparent backgrounds */
+.content-viewer:not(.dark-mode) .line * {
+  background: transparent !important;
+}
+
+.content-viewer.dark-mode .line * {
+  background: transparent !important;
+}
+
 /* Light mode syntax highlighting - high contrast colors */
 .content-viewer:not(.dark-mode) .line pre code {
   background-color: transparent !important;
@@ -701,32 +710,38 @@ onMounted(async () => {
 .content-viewer:not(.dark-mode) .hljs {
   background: transparent !important;
   color: #24292e !important;
+  display: inline !important;
 }
 
 .content-viewer:not(.dark-mode) .hljs-attr,
 .content-viewer:not(.dark-mode) .hljs-attribute {
   color: #6f42c1 !important;
   font-weight: 600;
+  background: transparent !important;
 }
 
 .content-viewer:not(.dark-mode) .hljs-string {
   color: #032f62 !important;
   font-weight: 500;
+  background: transparent !important;
 }
 
 .content-viewer:not(.dark-mode) .hljs-number {
   color: #005a9c !important;
   font-weight: 600;
+  background: transparent !important;
 }
 
 .content-viewer:not(.dark-mode) .hljs-literal {
   color: #d73a49 !important;
   font-weight: 600;
+  background: transparent !important;
 }
 
 .content-viewer:not(.dark-mode) .hljs-name {
   color: #24292e !important;
   font-weight: 600;
+  background: transparent !important;
 }
 
 /* Dark mode syntax highlighting */
@@ -738,23 +753,28 @@ onMounted(async () => {
 .content-viewer.dark-mode .hljs {
   background: transparent !important;
   color: #e1e4e8 !important;
+  display: inline !important;
 }
 
 .content-viewer.dark-mode .hljs-attr,
 .content-viewer.dark-mode .hljs-attribute {
   color: #79b8ff !important;
+  background: transparent !important;
 }
 
 .content-viewer.dark-mode .hljs-string {
   color: #85e89d !important;
+  background: transparent !important;
 }
 
 .content-viewer.dark-mode .hljs-number {
   color: #79b8ff !important;
+  background: transparent !important;
 }
 
 .content-viewer.dark-mode .hljs-literal {
   color: #f97583 !important;
+  background: transparent !important;
 }
 
 .line-wrap .line pre {