diff --git a/index.html b/index.html
index 8027dc0..58164da 100644
--- a/index.html
+++ b/index.html
@@ -9,6 +9,7 @@
+
@@ -23,6 +24,17 @@
margin: 0;
font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
}
+ @media (prefers-color-scheme: dark) {
+ body {
+ background-color: rgb(33,34,37);
+ }
+ :root{
+ --el-color-white: rgb(18,18,18);
+ }
+ .el-loading-mask {
+ --el-mask-color: rgb(20,20,20);
+ }
+ }
::-webkit-scrollbar {
display: none; /* Chrome Safari */
}
@@ -60,6 +72,14 @@
}
)
}
+ const darkModeQuery = window.matchMedia("(prefers-color-scheme: dark)");
+ const classVal = document.getElementsByTagName('html')[0].classList;
+ if (darkModeQuery.matches) {
+ classVal.add("dark");
+ }
+ darkModeQuery.addEventListener("change", (e) => {
+ e.matches ? classVal.add("dark") : classVal.remove("dark")
+ });
diff --git a/src/App.vue b/src/App.vue
index 4b5badc..4d63607 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,25 +1,36 @@