From 9be7089f4f90365ff3105824f3867b84d6bca077 Mon Sep 17 00:00:00 2001
From: Krystine Sherwin <93062060+KrystalDelusion@users.noreply.github.com>
Date: Sat, 11 May 2024 10:40:28 +1200
Subject: [PATCH] Docs-css: Add invert-helper class for images

Use svg color filter matrix from @jix to invert brightness for images when using dark theme.

Co-authored-by: Jannis Harder <me@jix.one>
---
 docs/source/_static/yosyshq.css | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/docs/source/_static/yosyshq.css b/docs/source/_static/yosyshq.css
index 57ae8f87a5f..447c8536743 100644
--- a/docs/source/_static/yosyshq.css
+++ b/docs/source/_static/yosyshq.css
@@ -24,3 +24,17 @@ a.external {
 th {
     text-align: left;
 }
+
+body[data-theme="dark"] {
+    .invert-helper {
+        filter: url("data:image/svg+xml,<svg xmlns='http%3A//www.w3.org/2000/svg'><filter id='f'><feColorMatrix color-interpolation-filters='sRGB' type='matrix' values='1.47 -1.73 -0.467 0 0.867 -0.733 0.467 -0.467 0 0.867 -0.667 -1.07 1.07 0 0.867 0 0 0 1.0 0'></feColorMatrix></filter></svg>#f");
+    }
+}
+
+@media (prefers-color-scheme: dark) {
+    body:not([data-theme="light"]) {
+        .invert-helper {
+            filter: url("data:image/svg+xml,<svg xmlns='http%3A//www.w3.org/2000/svg'><filter id='f'><feColorMatrix color-interpolation-filters='sRGB' type='matrix' values='1.47 -1.73 -0.467 0 0.867 -0.733 0.467 -0.467 0 0.867 -0.667 -1.07 1.07 0 0.867 0 0 0 1.0 0'></feColorMatrix></filter></svg>#f");
+        }
+    }
+}
\ No newline at end of file