fix: add class-based dark mode fallback styling
Add .dark class on html element with direct element styling as fallback for when CSS custom properties don't work. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
0852707df0
commit
29cda763eb
2 changed files with 26 additions and 1 deletions
|
|
@ -911,3 +911,28 @@ footer a:hover {
|
|||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
/* Dark mode class-based fallback */
|
||||
.dark {
|
||||
background: #0f0f0f !important;
|
||||
color: #e8eaed !important;
|
||||
}
|
||||
.dark .site-header {
|
||||
background: #1a1a1a !important;
|
||||
border-color: #2e2e2e !important;
|
||||
}
|
||||
.dark .search-box,
|
||||
.dark input[type="text"],
|
||||
.dark input[type="search"] {
|
||||
background: #1a1a1a !important;
|
||||
border-color: #2e2e2e !important;
|
||||
color: #e8eaed !important;
|
||||
}
|
||||
.dark .result-item,
|
||||
.dark .result-item:hover {
|
||||
background: #1a1a1a !important;
|
||||
border-color: #2e2e2e !important;
|
||||
}
|
||||
.dark a {
|
||||
color: #14b8a6 !important;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{{define "base"}}
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" data-theme="{{.Theme}}">
|
||||
<html lang="en" data-theme="{{.Theme}}" class="{{.Theme}}">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue