From 50033089b31b3849c38352c6be9c3e980abebece Mon Sep 17 00:00:00 2001
From: KawaiiZapic <577358285@qq.com>
Date: Mon, 24 Jul 2023 09:49:14 +0800
Subject: [PATCH] support dark mode

---
 static/css/loading.css | 12 +++++++++++
 static/css/main.css    | 45 ++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 57 insertions(+)

diff --git a/static/css/loading.css b/static/css/loading.css
index 0d34180..8d211af 100644
--- a/static/css/loading.css
+++ b/static/css/loading.css
@@ -175,3 +175,15 @@
         flex-direction: column;
     }
 }
+
+@media (prefers-color-scheme: dark) {
+    body, .loading-mask {
+        background-color: #333;
+    }
+    .loading-text {
+        color: #ddd;
+    }
+    .loading-indicator .circle-line {
+        stroke: #fb7299;
+    }
+}
\ No newline at end of file
diff --git a/static/css/main.css b/static/css/main.css
index 653631c..76dc6f1 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -476,3 +476,48 @@ body.locked, .content-container, .self-wrapper, .article-title {
         align-items: start;
     }
 }
+
+@media (prefers-color-scheme: dark) {
+    @keyframes name-out {
+        0% {
+            transform: translateY(0);
+            opacity: 0;
+        }
+
+        33% {
+            transform: translateY(0);
+            opacity: 0;
+        }
+
+        66% {
+            opacity: 1;
+            color: #ddd;
+            transform: translateY(-1em);
+            text-shadow: none;
+        }
+
+        100% {
+            transform: translateY(-1.2em);
+            opacity: 1;
+            color: white;
+            text-shadow: 4px 4px 5px rgba(0, 0, 0, .5);
+        }
+
+    }
+
+    .content-container {
+        background-color: #333;
+    }
+
+    a[href].link-item, body {
+        color: #ddd;
+    }
+
+    .background-layer {
+        filter: brightness(0.75);
+    }
+
+    .background-layer.loading {
+        filter: brightness(0.75) blur(50px);
+    }
+}
\ No newline at end of file