Thread viewer for Bluesky
Fix dark mode
merges #6
authored by
Heika
and committed by
+10
-6
src/components/AccountMenu.svelte
+10
-6
src/components/AccountMenu.svelte
···
100
<AccountMenuButton onclick={logOut} label="Log out" />
101
{/if}
102
103
-
<li class="link"><a href="{getBaseLocation()}">Home</a></li>
104
<li class="link"><a href="?page=posting_stats">Posting stats</a></li>
105
<li class="link"><a href="?page=like_stats">Like stats</a></li>
106
<li class="link"><a href="?page=search">Timeline search</a></li>
···
172
}
173
174
@media (prefers-color-scheme: dark) {
175
-
#account.active {
176
-
color: #333;
177
}
178
179
-
#account_menu {
180
-
background: hsl(210, 33.33%, 94.0%);
181
-
border-color: #ccc;
182
}
183
}
184
</style>
···
100
<AccountMenuButton onclick={logOut} label="Log out" />
101
{/if}
102
103
+
<li class="link"><a href={getBaseLocation()}>Home</a></li>
104
<li class="link"><a href="?page=posting_stats">Posting stats</a></li>
105
<li class="link"><a href="?page=like_stats">Like stats</a></li>
106
<li class="link"><a href="?page=search">Timeline search</a></li>
···
172
}
173
174
@media (prefers-color-scheme: dark) {
175
+
#account_menu {
176
+
background: hsl(210, 11.81%, 24.9%);
177
+
border-color: hsl(210, 19.61%, 40%);
178
}
179
180
+
li.link a {
181
+
color: #ccc;
182
+
}
183
+
184
+
#account_menu :global(li:not(.link) + li.link) {
185
+
border-top-color: hsl(210, 19.61%, 40%);
186
}
187
}
188
</style>
+12
-4
src/components/AccountMenuButton.svelte
+12
-4
src/components/AccountMenuButton.svelte
···
32
33
@media (prefers-color-scheme: dark) {
34
li .button {
35
+
color: #ccc;
36
+
border-color: hsl(210, 19.61%, 40%);
37
+
background-color: hsla(210, 100%, 80%, 0.08);
38
}
39
40
li .button:hover {
41
+
color: #fff;
42
+
border-color: hsl(210, 22.13%, 52.16%);
43
+
background-color: hsla(210, 100%, 80%, 0.15);
44
+
}
45
+
46
+
li .button:active {
47
+
color: #fff;
48
+
border-color: hsl(210, 28.4%, 31.76%);
49
+
background-color: hsla(210, 100%, 80%, 0.05);
50
}
51
}
52
</style>
+9
-4
src/components/DialogPanel.svelte
+9
-4
src/components/DialogPanel.svelte
···
137
}
138
139
input[type="submit"] {
140
+
background-color: hsl(210, 53.33%, 35.29%);
141
+
border-color: hsl(210, 45.28%, 41.57%);
142
+
}
143
+
144
+
input[type="submit"]:hover {
145
+
background-color: hsl(210, 45.28%, 41.57%);
146
+
border-color: hsl(210, 39.34%, 47.84%);
147
}
148
149
input[type="submit"]:active {
150
+
border-color: hsl(210, 64.86%, 29.02%);
151
+
background-color: hsl(210, 53.33%, 35.29%);
152
}
153
}
154
}