From 93af6cf603c05c600850cb1b17991329d9f37f07 Mon Sep 17 00:00:00 2001
From: Jonas Tobias Hopusch <git@jotoho.de>
Date: Sun, 26 Mar 2023 22:04:41 +0200
Subject: [PATCH] Invert QR code when in dark mode

---
 content/profiles/index.md | 2 +-
 static/css/general.css    | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/content/profiles/index.md b/content/profiles/index.md
index 1cb923f..9883e95 100644
--- a/content/profiles/index.md
+++ b/content/profiles/index.md
@@ -18,4 +18,4 @@ The following list is probably not complete and will change over time.
 | Mastodon/Fediverse | [@jotoho@ruhr.social](https://ruhr.social/@jotoho) |                                                                                                                                              |
 | GitLab             | [@jotoho](https://gitlab.com/jotoho)               | Preferred Git hosting platform                                                                                                               |
 | GitHub             | [@jotoho](https://github.com/jotoho)               |                                                                                                                                              |
-| Threema            | [8WEESJ8K](https://threema.id/8WEESJ8K)            | <details><summary>QR-Code containing Threema-ID</summary><img src="threema-scanid-8weesj8k.svg" alt="Scannable QR-Code" width="1000px" height="1000px" loading="lazy" /></details>                         |
+| Threema            | [8WEESJ8K](https://threema.id/8WEESJ8K)            | <details><summary>QR-Code containing Threema-ID</summary><img src="threema-scanid-8weesj8k.svg" alt="Scannable QR-Code" width="1000px" height="1000px" loading="lazy" class="black-white-svg" /></details>                         |
diff --git a/static/css/general.css b/static/css/general.css
index e814b4e..70aa092 100644
--- a/static/css/general.css
+++ b/static/css/general.css
@@ -231,6 +231,10 @@ details[open] > summary {
   th {
     border-color: white;
   }
+
+  .black-white-svg {
+    filter: invert(100%);
+  }
 }
 
 @media (prefers-color-scheme: light) {