diff --git a/assets/logo-horizontal-inverted.svg b/assets/logo-horizontal-inverted.svg
new file mode 100644
index 0000000..dfecbbf
--- /dev/null
+++ b/assets/logo-horizontal-inverted.svg
@@ -0,0 +1,41 @@
+
+
+
diff --git a/assets/logo-horizontal.svg b/assets/logo-horizontal.svg
new file mode 100644
index 0000000..e867148
--- /dev/null
+++ b/assets/logo-horizontal.svg
@@ -0,0 +1,41 @@
+
+
+
diff --git a/assets/logo-vertical-inverted.svg b/assets/logo-vertical-inverted.svg
new file mode 100644
index 0000000..e4cbabc
--- /dev/null
+++ b/assets/logo-vertical-inverted.svg
@@ -0,0 +1,41 @@
+
+
+
diff --git a/assets/logo-vertical.svg b/assets/logo-vertical.svg
new file mode 100644
index 0000000..b5ecc26
--- /dev/null
+++ b/assets/logo-vertical.svg
@@ -0,0 +1,41 @@
+
+
+
diff --git a/assets/style.css b/assets/style.css
index 96dd994..d6b609a 100644
--- a/assets/style.css
+++ b/assets/style.css
@@ -11,6 +11,7 @@
color: #1b5e20;
}
+/* no background on leaflet marker */
.leaflet-container [role="button"],
.leaflet-container [type="button"],
.leaflet-container [type="file"]::file-selector-button,
@@ -21,3 +22,23 @@
border: unset;
box-shadow: unset;
}
+
+[data-theme="light"],
+:root:not([data-theme="dark"]),
+:host(:not([data-theme="dark"])) {
+ .logo {display:block};
+ .logo-inv {display:none};
+}
+
+@media only screen and (prefers-color-scheme: dark) {
+ :root:not([data-theme]),
+ :host(:not([data-theme])) {
+ .logo {display:none};
+ .logo-inv {display:block};
+ }
+}
+
+[data-theme="dark"] {
+ .logo {display:none};
+ .logo-inv {display:block};
+}
diff --git a/locales/de-AT.yml b/locales/de-AT.yml
index cab94bb..6ea6d21 100644
--- a/locales/de-AT.yml
+++ b/locales/de-AT.yml
@@ -1,5 +1,4 @@
_version: 1
-app_name: "Stationslauf-App"
stations: "Stationen"
stations_expl_without_first_word: "sind festgelegte Orte mit spezifischen Aufgaben."
station_warning_not_assigned_route: "Noch keiner Route zugeordnet" # should be short -> tooltip
diff --git a/src/admin/mod.rs b/src/admin/mod.rs
index afa776c..99b191c 100644
--- a/src/admin/mod.rs
+++ b/src/admin/mod.rs
@@ -77,9 +77,16 @@ async fn highscore(State(db): State>, session: Session) -> Marku
async fn index(session: Session) -> Markup {
let content = html! {
- h1 { (t!("app_name")) }
- a href="/auth/logout" {
- "Ausloggen"
+ nav {
+ ul {
+ img class="logo" src="/logo-hor.svg" style="max-width: 100%; width: 25em; margin:auto;";
+ img class="logo-inv" src="/logo-hor-inv.svg" width="max-width: 100%; width: 25em; margin:auto;";
+ }
+ ul {
+ a href="/auth/logout" {
+ "Ausloggen"
+ }
+ }
}
nav {
ul {
diff --git a/src/lib.rs b/src/lib.rs
index 6c55205..ab7594a 100644
--- a/src/lib.rs
+++ b/src/lib.rs
@@ -84,6 +84,10 @@ const MY_CSS: &str = include_str!("../assets/style.css");
const LEAFLET_CSS: &str = include_str!("../assets/leaflet.css");
const LEAFLET_JS: &str = include_str!("../assets/leaflet.js");
const MARKER_PNG: &[u8] = include_bytes!("../assets/marker-icon.png");
+const LOGO_HOR: &[u8] = include_bytes!("../assets/logo-horizontal.svg");
+const LOGO_VER: &[u8] = include_bytes!("../assets/logo-vertical.svg");
+const LOGO_HOR_INV: &[u8] = include_bytes!("../assets/logo-horizontal-inverted.svg");
+const LOGO_VER_INV: &[u8] = include_bytes!("../assets/logo-vertical-inverted.svg");
async fn serve_pico_css() -> Response {
Response::builder()
@@ -119,6 +123,30 @@ async fn serve_marker_png() -> Response {
.body(Body::from(MARKER_PNG))
.unwrap()
}
+async fn logo_hor() -> Response {
+ Response::builder()
+ .header("Content-Type", "image/svg+xml")
+ .body(Body::from(LOGO_HOR))
+ .unwrap()
+}
+async fn logo_ver() -> Response {
+ Response::builder()
+ .header("Content-Type", "image/svg+xml")
+ .body(Body::from(LOGO_VER))
+ .unwrap()
+}
+async fn logo_hor_inv() -> Response {
+ Response::builder()
+ .header("Content-Type", "image/svg+xml")
+ .body(Body::from(LOGO_HOR_INV))
+ .unwrap()
+}
+async fn logo_ver_inv() -> Response {
+ Response::builder()
+ .header("Content-Type", "image/svg+xml")
+ .body(Body::from(LOGO_VER_INV))
+ .unwrap()
+}
#[derive(Clone)]
struct AppState {
@@ -152,6 +180,10 @@ fn router(db: SqlitePool) -> Router {
.route("/leaflet.css", get(serve_leaflet_css))
.route("/leaflet.js", get(serve_leaflet_js))
.route("/marker.png", get(serve_marker_png))
+ .route("/logo-hor.svg", get(logo_hor))
+ .route("/logo-ver.svg", get(logo_ver))
+ .route("/logo-hor-inv.svg", get(logo_hor_inv))
+ .route("/logo-ver-inv.svg", get(logo_ver_inv))
.with_state(state)
.layer(auth_layer)
}