Better dark mode support

This commit is contained in:
Melon 2023-12-17 16:03:13 +00:00
parent 56ff556928
commit ab4693a9ac
Signed by: melon
GPG Key ID: 6C9D970C50D26A25
16 changed files with 24 additions and 20 deletions

View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>{{.ServiceName}}</title>
<link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
<link rel="stylesheet" href="/theme/style.css">
</head>
<body>
<header>

View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>{{.ServiceName}}</title>
<link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
<link rel="stylesheet" href="/theme/style.css">
</head>
<body>
<header>

View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>{{.ServiceName}}</title>
<link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
<link rel="stylesheet" href="/theme/style.css">
</head>
<body>
<header>

View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>{{.ServiceName}}</title>
<link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
<link rel="stylesheet" href="/theme/style.css">
</head>
<body>
<header>

View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>{{.ServiceName}}</title>
<link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
<link rel="stylesheet" href="/theme/style.css">
</head>
<body>
<header>

View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>{{.ServiceName}}</title>
<link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
<link rel="stylesheet" href="/theme/style.css">
</head>
<body>
<header>

View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>{{.ServiceName}}</title>
<link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
<link rel="stylesheet" href="/theme/style.css">
</head>
<body>
<header>

View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>{{.ServiceName}}</title>
<link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
<link rel="stylesheet" href="/theme/style.css">
<script>
window.addEventListener("load", function () {
selectText("app-secret");

View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>{{.ServiceName}}</title>
<link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
<link rel="stylesheet" href="/theme/style.css">
</head>
<body>
<header>

View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>{{.ServiceName}}</title>
<link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
<link rel="stylesheet" href="/theme/style.css">
</head>
<body>
<header>

View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>{{.ServiceName}}</title>
<link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
<link rel="stylesheet" href="/theme/style.css">
</head>
<body>
<header>

View File

@ -2,7 +2,7 @@
<html lang="en">
<head>
<title>{{.ServiceName}}</title>
<link rel="stylesheet" href="/theme/dark.css" media="screen and (prefers-color-scheme: dark)">
<link rel="stylesheet" href="/theme/style.css">
</head>
<body>
<header>

View File

@ -156,8 +156,8 @@ func NewHttpServer(conf Conf, db *database.DB, privKey []byte) *http.Server {
}))
// theme styles
r.GET("/theme/dark.css", func(rw http.ResponseWriter, req *http.Request, params httprouter.Params) {
http.ServeContent(rw, req, "dark.css", time.Now(), bytes.NewReader(theme.DarkThemeCss))
r.GET("/theme/style.css", func(rw http.ResponseWriter, req *http.Request, params httprouter.Params) {
http.ServeContent(rw, req, "style.css", time.Now(), bytes.NewReader(theme.ThemeCss))
})
// login steps

View File

@ -1,4 +0,0 @@
html, body {
background-color: #242424;
color: #eeeeee;
}

8
theme/style.css Normal file
View File

@ -0,0 +1,8 @@
html, body {
color-scheme: light dark;
}
@media screen and (prefers-color-scheme: dark) {
background-color: #242424;
color: #eeeeee;
}

View File

@ -2,5 +2,5 @@ package theme
import _ "embed"
//go:embed dark.css
var DarkThemeCss []byte
//go:embed style.css
var ThemeCss []byte