Skip to content

Commit 0a2d37f

Browse files
Yukida-liii
Yuki
authored and
da-liii
committed
[5_34] 黑夜模式适配2
1 parent 3b4420d commit 0a2d37f

File tree

4 files changed

+138
-48
lines changed

4 files changed

+138
-48
lines changed

‎docs/.vitepress/components/Button/DownloadButtonMacOS.vue‎

Lines changed: 25 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,7 @@ function downloadFileArm() {
7575
text-align: center;
7676
border-radius: 10px;
7777
background-color: white;
78+
color: #333;
7879
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
7980
transition: transform 0.2s, background-color 0.2s;
8081
cursor: pointer;
@@ -106,7 +107,6 @@ function downloadFileArm() {
106107
.button p {
107108
margin-top: 10px;
108109
font-size: 16px;
109-
color: #333;
110110
}
111111
112112
.hoverContent {
@@ -115,7 +115,6 @@ function downloadFileArm() {
115115
align-items: center;
116116
justify-content: center;
117117
font-size: 18px;
118-
color: #A5C9F8;
119118
}
120119
121120
.modalBackdrop {
@@ -133,9 +132,11 @@ function downloadFileArm() {
133132
134133
.modalContent {
135134
background: white;
135+
color: black;
136136
padding: 20px;
137137
border-radius: 10px;
138138
text-align: center;
139+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
139140
}
140141
141142
.smallButton {
@@ -199,4 +200,26 @@ function downloadFileArm() {
199200
font-size: 16px;
200201
}
201202
}
203+
204+
@media (prefers-color-scheme: dark) {
205+
.button {
206+
background-color: #333;
207+
color: white;
208+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
209+
}
210+
211+
.modalContent {
212+
background-color: #444;
213+
color: white;
214+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.7);
215+
}
216+
217+
.hoverContent {
218+
color: black;
219+
}
220+
221+
.smallButton, .closeButton {
222+
color: white;
223+
}
224+
}
202225
</style>

‎docs/.vitepress/components/Button/DownloadButtonUbuntu.vue‎

Lines changed: 25 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -77,6 +77,7 @@ function downloadFile2404() {
7777
text-align: center;
7878
border-radius: 10px;
7979
background-color: white;
80+
color: #333;
8081
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
8182
transition: transform 0.2s, background-color 0.2s;
8283
cursor: pointer;
@@ -108,7 +109,6 @@ function downloadFile2404() {
108109
.button p {
109110
margin-top: 10px;
110111
font-size: 16px;
111-
color: #333;
112112
}
113113
114114
.hoverContent {
@@ -117,7 +117,6 @@ function downloadFile2404() {
117117
align-items: center;
118118
justify-content: center;
119119
font-size: 18px;
120-
color: #ea4f06;
121120
}
122121
123122
.modalBackdrop {
@@ -135,9 +134,11 @@ function downloadFile2404() {
135134
136135
.modalContent {
137136
background: white;
137+
color: black;
138138
padding: 20px;
139139
border-radius: 10px;
140140
text-align: center;
141+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
141142
}
142143
143144
.smallButton {
@@ -201,4 +202,26 @@ function downloadFile2404() {
201202
font-size: 16px;
202203
}
203204
}
205+
206+
@media (prefers-color-scheme: dark) {
207+
.button {
208+
background-color: #333;
209+
color: white;
210+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
211+
}
212+
213+
.modalContent {
214+
background-color: #444;
215+
color: white;
216+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.7);
217+
}
218+
219+
.hoverContent {
220+
color: black;
221+
}
222+
223+
.smallButton, .closeButton {
224+
color: white;
225+
}
226+
}
204227
</style>

‎docs/.vitepress/components/Button/DownloadButtonWindows.vue‎

Lines changed: 27 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,6 @@ function downloadFileGreen() {
6060
link.click();
6161
document.body.removeChild(link);
6262
}
63-
6463
</script>
6564

6665
<style module>
@@ -76,6 +75,7 @@ function downloadFileGreen() {
7675
text-align: center;
7776
border-radius: 10px;
7877
background-color: white;
78+
color: #333;
7979
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
8080
transition: transform 0.2s, background-color 0.2s;
8181
cursor: pointer;
@@ -107,7 +107,6 @@ function downloadFileGreen() {
107107
.button p {
108108
margin-top: 10px;
109109
font-size: 16px;
110-
color: #333;
111110
}
112111
113112
.hoverContent {
@@ -116,7 +115,7 @@ function downloadFileGreen() {
116115
align-items: center;
117116
justify-content: center;
118117
font-size: 18px;
119-
color: #007bff;
118+
120119
}
121120
122121
.modalBackdrop {
@@ -134,9 +133,11 @@ function downloadFileGreen() {
134133
135134
.modalContent {
136135
background: white;
136+
color: black;
137137
padding: 20px;
138138
border-radius: 10px;
139139
text-align: center;
140+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
140141
}
141142
142143
.smallButton {
@@ -200,4 +201,26 @@ function downloadFileGreen() {
200201
font-size: 16px;
201202
}
202203
}
203-
</style>
204+
205+
@media (prefers-color-scheme: dark) {
206+
.button {
207+
background-color: #333;
208+
color: white;
209+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
210+
}
211+
212+
.modalContent {
213+
background-color: #444;
214+
color: white;
215+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.7);
216+
}
217+
218+
.hoverContent {
219+
color: black;
220+
}
221+
222+
.smallButton, .closeButton {
223+
color: white;
224+
}
225+
}
226+
</style>

‎docs/.vitepress/components/Button/SHA256Button.vue‎

Lines changed: 61 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,7 @@
55
<div v-if="showModal" :class="$style.modalBackdrop" @click.self="showModal = false">
66
<div :class="$style.modalContent">
77
<h3>{{ modalTitle }}</h3>
8-
<pre>
9-
{{ checksums }}
10-
</pre>
8+
<pre>{{ checksums }}</pre>
119
<button :class="$style.closeButton" @click="showModal = false">{{ closeButtonText }}</button>
1210
</div>
1311
</div>
@@ -40,63 +38,86 @@ f4bcb8d4a9bec63b158c93fc0efbc083da95de84ddf7fb84ecf56675120458e5 mogan-research
4038

4139
<style module>
4240
.button {
43-
color: white;
44-
background-color: #007bff;
45-
padding: 10px 20px;
46-
border: none;
47-
border-radius: 5px;
48-
font-weight: bold;
49-
cursor: pointer;
50-
transition: background-color 0.3s, transform 0.3s;
41+
color: white;
42+
background-color: #007bff;
43+
padding: 10px 20px;
44+
border: none;
45+
border-radius: 5px;
46+
font-weight: bold;
47+
cursor: pointer;
48+
transition: background-color 0.3s, transform 0.3s;
5149
}
5250
5351
.button:hover {
54-
background-color: #0056b3;
52+
background-color: #0056b3;
5553
}
5654
5755
.button:active {
58-
background-color: #003f7f;
59-
transform: scale(0.95);
56+
background-color: #003f7f;
57+
transform: scale(0.95);
6058
}
6159
6260
.modalBackdrop {
63-
position: fixed;
64-
top: 0;
65-
left: 0;
66-
width: 100%;
67-
height: 100%;
68-
background: rgba(0, 0, 0, 0.5);
69-
display: flex;
70-
align-items: center;
71-
justify-content: center;
72-
z-index: 1000;
61+
position: fixed;
62+
top: 0;
63+
left: 0;
64+
width: 100%;
65+
height: 100%;
66+
background: rgba(0, 0, 0, 0.5);
67+
display: flex;
68+
align-items: center;
69+
justify-content: center;
70+
z-index: 1000;
7371
}
7472
7573
.modalContent {
76-
background: white;
77-
padding: 20px;
78-
border-radius: 10px;
79-
text-align: left;
80-
max-width: 90%;
74+
background: white;
75+
color: black;
76+
padding: 20px;
77+
border-radius: 10px;
78+
text-align: left;
79+
max-width: 90%;
8180
}
8281
8382
.closeButton {
84-
margin-top: 20px;
85-
padding: 5px 10px;
86-
font-size: 14px;
87-
color: white;
88-
background-color: #ff4d4d;
89-
border: none;
90-
border-radius: 5px;
91-
cursor: pointer;
92-
transition: background-color 0.2s;
83+
margin-top: 20px;
84+
padding: 5px 10px;
85+
font-size: 14px;
86+
color: white;
87+
background-color: #ff4d4d;
88+
border: none;
89+
border-radius: 5px;
90+
cursor: pointer;
91+
transition: background-color 0.2s;
9392
}
9493
9594
.closeButton:hover {
96-
background-color: #cc0000;
95+
background-color: #cc0000;
9796
}
9897
9998
.closeButton:active {
100-
background-color: #990000;
99+
background-color: #990000;
100+
}
101+
102+
@media (prefers-color-scheme: dark) {
103+
.button {
104+
background-color: #333;
105+
color: white;
106+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
107+
}
108+
109+
.modalContent {
110+
background-color: #444;
111+
color: white;
112+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.7);
113+
}
114+
115+
.hoverContent {
116+
color: black;
117+
}
118+
119+
.smallButton, .closeButton {
120+
color: white;
121+
}
101122
}
102123
</style>

0 commit comments

Comments
 (0)