Add a dark theme to the dashboard

This commit is contained in:
Kerollmops 2020-07-13 23:51:41 +02:00
parent 3d144e62c4
commit aa92311d4e
No known key found for this signature in database
GPG Key ID: 92ADA4E935E71FA4
4 changed files with 30 additions and 1 deletions

1
public/bulma-prefers-dark.min.css vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -58,7 +58,7 @@ em {
padding-right: 10px;
box-sizing: border-box;
text-transform: uppercase;
color: rgba(0,0,0,.7);
opacity: 0.7;
}
.content {
@ -78,3 +78,22 @@ em {
.fade-in-out {
animation: fadeInOut ease 1s infinite;
}
@media (prefers-color-scheme:dark) {
.hero.is-light {
background-color: #242424;
color: inherit;
}
.hero.is-light .title {
color: inherit;
}
.document {
background-color: #242424;
}
.content {
color: #dbdbdb;
}
}

View File

@ -90,6 +90,13 @@ async fn main() -> anyhow::Result<()> {
.body(include_str!("../../public/bulma.min.css"))
);
let dash_bulma_dark_route = warp::filters::method::get()
.and(warp::path!("bulma-prefers-dark.min.css"))
.map(|| Response::builder()
.header("content-type", "text/css; charset=utf-8")
.body(include_str!("../../public/bulma-prefers-dark.min.css"))
);
let dash_style_route = warp::filters::method::get()
.and(warp::path!("style.css"))
.map(|| Response::builder()
@ -160,6 +167,7 @@ async fn main() -> anyhow::Result<()> {
let routes = dash_html_route
.or(dash_bulma_route)
.or(dash_bulma_dark_route)
.or(dash_style_route)
.or(dash_jquery_route)
.or(dash_papaparse_route)

View File

@ -4,6 +4,7 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="/bulma.min.css">
<link rel="stylesheet" href="/bulma-prefers-dark.min.css">
<link rel="stylesheet" href="/style.css">
<script type="text/javascript" src="/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="/papaparse.min.js"></script>