From d316df264b79d43c6d9bdcb4bf5c7e6c44538f60 Mon Sep 17 00:00:00 2001
From: Timur Mashara <timur@metabase.com>
Date: Tue, 23 Jun 2026 18:23:49 +0200
Subject: [PATCH] make api docs load only required styles files

---
 _includes/shared-chrome/stylesheets.html | 13 +++++++++++++
 css/main.css                             | 12 ------------
 2 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/_includes/shared-chrome/stylesheets.html b/_includes/shared-chrome/stylesheets.html
index e1fee631a8..0c21c84765 100644
--- a/_includes/shared-chrome/stylesheets.html
+++ b/_includes/shared-chrome/stylesheets.html
@@ -1,3 +1,16 @@
+{% comment %}
+  On the Scalar API reference page (layout: docs-api), the Metabase theme
+  stylesheets bleed into Scalar's own styles (e.g. white-on-white titles in
+  dark mode), so skip them there and load everything else as usual.
+{% endcomment %}
+{% assign css_denylist = "" | split: "," %}
+{% if page.layout == "docs-api" %}{% assign css_denylist = "css/main.css,css/styles.css,css/docs.css" | split: "," %}{% endif %}
 {% for stylesheet in site.data.shared_chrome.stylesheets %}
+  {% assign denied = false %}
+  {% for css in css_denylist %}
+    {% if stylesheet.attributes.href contains css %}{% assign denied = true %}{% endif %}
+  {% endfor %}
+  {% unless denied %}
   <{{ stylesheet.tag }}{% for attribute in stylesheet.attributes %} {{ attribute[0] }}="{{ attribute[1] }}"{% endfor %} />
+  {% endunless %}
 {% endfor %}
diff --git a/css/main.css b/css/main.css
index ba2984cde6..d533f8553a 100644
--- a/css/main.css
+++ b/css/main.css
@@ -25,18 +25,6 @@ body {
   text-rendering: optimizelegibility;
 }
 
-body.dark-mode {
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6,
-  li {
-    color: white;
-  }
-}
-
 body header.bootstrap {
   position: sticky;
   top: -48px;