2 files changed, 52 insertions, 0 deletions
diff --git a/docs/_static/changelog.css b/docs/_static/changelog.css
new file mode 100644
index 00000000..343792a1
--- /dev/null
+++ b/docs/_static/changelog.css
@@ -0,0 +1,11 @@
+[data-theme='dark'] #changelog .dark,
+[data-theme='light'] #changelog .light,
+[data-theme='auto'] #changelog .light {
+    display: inline;
+}
+
+[data-theme='dark'] #changelog .light,
+[data-theme='light'] #changelog .dark,
+[data-theme='auto'] #changelog .dark {
+    display: none;
+}
diff --git a/docs/_static/changelog.js b/docs/_static/changelog.js
new file mode 100644
index 00000000..94834eaa
--- /dev/null
+++ b/docs/_static/changelog.js
@@ -0,0 +1,41 @@
+/** Update the changelog colors in dark mode */
+function changelog_color_main() {
+    const changelog = document.getElementById("changelog");
+
+    function updateEntryColor(span) {
+        const lightColorSpan = span;
+        const darkColorSpan = lightColorSpan.cloneNode(true);
+
+        lightColorSpan.parentElement.insertBefore(darkColorSpan, lightColorSpan);
+
+        lightColorSpan.classList.add("light");
+        darkColorSpan.classList.add("dark");
+
+        let color;
+        switch (darkColorSpan.textContent) {
+            case "Feature":
+                color = "#5BF38E";
+                break;
+            case "Support":
+                color = "#55A5E7";
+                break;
+            case "Bug":
+                color = "#E14F4F";
+                break;
+            default:
+                color = lightColorSpan.style.color;
+        }
+
+        darkColorSpan.style["color"] = color;
+    }
+
+    const TYPES = ["Feature", "Bug", "Support", "Breaking"];
+
+    if (changelog !== null) {
+        Array.from(changelog.getElementsByTagName("span"))
+            .filter(value => TYPES.includes(value.textContent))
+            .forEach(updateEntryColor)
+    }
+}
+
+changelog_color_main();