From 8df00492a5227246996bb8f78370d558e419f994 Mon Sep 17 00:00:00 2001
From: kkk <3441771296@qq.com>
Date: Tue, 2 Mar 2021 10:36:42 +0800
Subject: [PATCH 1/2] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=20idea=20=E5=BF=BD?=
=?UTF-8?q?=E7=95=A5=E6=96=87=E4=BB=B6,=E4=BF=AE=E6=94=B9=20css?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.gitignore | 2 +-
resource/static/theme-hotaru/css/darkmode.css | 7 ++++++-
2 files changed, 7 insertions(+), 2 deletions(-)
diff --git a/.gitignore b/.gitignore
index 0f175e8..50e5136 100644
--- a/.gitignore
+++ b/.gitignore
@@ -10,7 +10,7 @@
# Output of the go coverage tool, specifically when used with LiteIDE
*.out
-
+.idea
/data
/dist
.DS_Store
diff --git a/resource/static/theme-hotaru/css/darkmode.css b/resource/static/theme-hotaru/css/darkmode.css
index 83a518a..7c222b6 100644
--- a/resource/static/theme-hotaru/css/darkmode.css
+++ b/resource/static/theme-hotaru/css/darkmode.css
@@ -7,8 +7,13 @@ body.dark table.table-striped tr.even {
background-color: #212f36;
}
+#servers tr:nth-child(odd) {
+ /* color: red; */
+ background: #384d58;
+}
+
body.dark table.table-striped tr.odd {
- background-color: #2f3c42;
+ background-color: #384d58;
}
body.dark tr.expandRow {
From c18df6bdbf8f4907a1f964068e11b25fba40d693 Mon Sep 17 00:00:00 2001
From: kkk <3441771296@qq.com>
Date: Tue, 2 Mar 2021 11:47:12 +0800
Subject: [PATCH 2/2] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=AC=AC=E4=B8=89?=
=?UTF-8?q?=E4=B8=AA=E4=B8=BB=E9=A2=98=E7=9A=84=E6=89=8B=E5=8A=A8=E5=88=87?=
=?UTF-8?q?=E6=8D=A2=E7=99=BD=E9=BB=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
resource/static/theme-hotaru/css/darkmode.css | 205 +++++++++++++++++-
resource/template/theme-hotaru/home.html | 20 +-
2 files changed, 223 insertions(+), 2 deletions(-)
diff --git a/resource/static/theme-hotaru/css/darkmode.css b/resource/static/theme-hotaru/css/darkmode.css
index 7c222b6..49682eb 100644
--- a/resource/static/theme-hotaru/css/darkmode.css
+++ b/resource/static/theme-hotaru/css/darkmode.css
@@ -32,4 +32,207 @@ body.dark .panel span {
body.dark .page-section {
border-bottom: 1px solid #212f36;
-}
\ No newline at end of file
+}
+
+@media (max-width: 500px) {
+ .sidebar-container {
+ display: none
+ }
+}
+
+.sidebar-container ul {
+ position: fixed;
+ top: 50%;
+ list-style: none;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-orient: vertical;
+ -webkit-box-direction: normal;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -webkit-transform: translateY(-50%);
+ transform: translateY(-50%);
+ z-index: 10;
+ -webkit-box-align: end;
+ -ms-flex-align: end;
+ align-items: flex-end;
+ right: 0
+}
+
+.sidebar-container ul li + li {
+ margin-top: 1.5em
+}
+
+.sidebar-container ul li {
+ position: relative;
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ -webkit-box-align: center;
+ -ms-flex-align: center;
+ align-items: center;
+ padding: 0.4em 0 0.4em 0;
+ color: #f2f2f2;
+ cursor: pointer;
+ height: 2em;
+ -webkit-box-shadow: 0 2px 3px -1px rgba(47, 47, 47, 0.2);
+ box-shadow: 0 2px 3px -1px rgba(47, 47, 47, 0.2);
+ width: 35px;
+ border-radius: 0.5em 0 0 0.5em;
+ border: 1px solid rgba(255, 255, 255, 0.2)
+}
+
+@media (min-width: 1400px) {
+ .sidebar-container ul li {
+ height: 2.6em;
+ width: 45px
+ }
+}
+
+.sidebar-container ul li:first-child {
+ background-color: #fbb142
+}
+
+.sidebar-container ul li:nth-child(2) {
+ background-color: #124b8c
+}
+
+.sidebar-container ul li:last-child {
+ background-color: #555
+}
+
+.sidebar-container ul li i.fas {
+ font-size: 1em;
+ width: 36px;
+ text-align: center;
+ position: relative;
+ top: 0.04em
+}
+
+.sidebar-container ul li .fas.fa-sun {
+ font-size: 1.3em
+}
+
+@media (min-width: 1400px) {
+ .sidebar-container ul li .fas.fa-sun {
+ font-size: 1.6em
+ }
+}
+
+.sidebar-container ul li .fas.fa-moon {
+ font-size: 1.2em
+}
+
+@media (min-width: 1400px) {
+ .sidebar-container ul li .fas.fa-moon {
+ font-size: 1.5em
+ }
+}
+
+.sidebar-container ul li span {
+ font-size: 1em;
+ left: 36px;
+ position: absolute;
+ opacity: 0;
+ visibility: hidden;
+ font-weight: bold
+}
+
+.sidebar-container ul li:hover {
+ width: 110px !important;
+ -webkit-box-shadow: 0 2px 10px -1px rgba(0, 0, 0, 0.1);
+ box-shadow: 0 2px 10px -1px rgba(0, 0, 0, 0.1)
+}
+
+.sidebar-container ul li:hover span {
+ visibility: visible;
+ opacity: 1;
+ -webkit-transition-delay: 90ms;
+ transition-delay: 90ms
+}
+
+.sidebar-container ul li:hover i {
+ opacity: 1
+}
+
+.sidebar-container ul li:hover i.fa-sun {
+ -webkit-animation: rotateSun 3s linear infinite;
+ animation: rotateSun 3s linear infinite
+}
+
+@-webkit-keyframes rotateSun {
+ to {
+ -webkit-transform: rotate(360deg);
+ transform: rotate(360deg)
+ }
+}
+@keyframes rotateSun {
+ to {
+ -webkit-transform: rotate(360deg);
+ transform: rotate(360deg)
+ }
+}
+
+.sidebar-container ul li:hover i.fa-moon {
+ -webkit-animation: rotateMoon 2s linear infinite;
+ animation: rotateMoon 2s linear infinite
+}
+
+@-webkit-keyframes rotateMoon {
+ 0% {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg)
+ }
+ 50% {
+ -webkit-transform: rotate(-45deg);
+ transform: rotate(-45deg)
+ }
+ 100% {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg)
+ }
+}
+
+@keyframes rotateMoon {
+ 0% {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg)
+ }
+ 50% {
+ -webkit-transform: rotate(-45deg);
+ transform: rotate(-45deg)
+ }
+ 100% {
+ -webkit-transform: rotate(0deg);
+ transform: rotate(0deg)
+ }
+}
+
+.sidebar-container ul li:hover i.fa-th {
+ -webkit-animation: rotateTh 1s linear infinite;
+ animation: rotateTh 1s linear infinite
+}
+
+@-webkit-keyframes rotateTh {
+ 0% {
+ -webkit-transform: perspective(400px) rotateY(0);
+ transform: perspective(400px) rotateY(0)
+ }
+ 100% {
+ -webkit-transform: perspective(400px) rotateY(180deg);
+ transform: perspective(400px) rotateY(180deg)
+ }
+}
+
+@keyframes rotateTh {
+ 0% {
+ -webkit-transform: perspective(400px) rotateY(0);
+ transform: perspective(400px) rotateY(0)
+ }
+ 100% {
+ -webkit-transform: perspective(400px) rotateY(180deg);
+ transform: perspective(400px) rotateY(180deg)
+ }
+}
+
diff --git a/resource/template/theme-hotaru/home.html b/resource/template/theme-hotaru/home.html
index 79908fb..174a440 100644
--- a/resource/template/theme-hotaru/home.html
+++ b/resource/template/theme-hotaru/home.html
@@ -15,10 +15,11 @@
+
-
+
{{if ts .CustomCode}}
{{.CustomCode|safe}}
{{end}}
@@ -132,6 +133,12 @@
+