From 8651f606452fd35908a54e19c8f93263174d619b Mon Sep 17 00:00:00 2001 From: Kai Vogelgesang Date: Mon, 5 Sep 2022 21:42:59 +0200 Subject: [PATCH] Scale document.body to 100% height, Implement footer --- frontend/src/App.svelte | 65 +++++++++++++++++++++++-------------- frontend/src/app.scss | 6 ++++ frontend/src/main.ts | 2 +- server/templates/index.html | 1 - 4 files changed, 48 insertions(+), 26 deletions(-) diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte index ad78227..310bb22 100644 --- a/frontend/src/App.svelte +++ b/frontend/src/App.svelte @@ -15,34 +15,51 @@ - -
-

Hallo i bims 1 frontend

-
- +
+ +
+

Hallo i bims 1 frontend

+
+ - foo + +
+
+
+

Fullheight hero

+

Fullheight subtitle

+
+
+
+ - bar + bar - monitoring + monitoring - mining + mining - stats + stats - -
-
-

404

-

- The page you are trying to reach either - does not exist - or - you are not authorized - to view it. -

-
-
- + +
+
+

404

+

+ The page you are trying to reach either + does not exist + or + you are not authorized + to view it. +

+
+
+ +
+ +
+
+ Test footer please ignore +
+
diff --git a/frontend/src/app.scss b/frontend/src/app.scss index 53bb026..e8cb75a 100644 --- a/frontend/src/app.scss +++ b/frontend/src/app.scss @@ -17,6 +17,12 @@ $fa-font-path: "@fortawesome/fontawesome-free/webfonts"; @import "@fortawesome/fontawesome-free/scss/brands.scss"; @import "@fortawesome/fontawesome-free/scss/v4-shims.scss"; +body { + min-height: 100vh; + display: flex; + flex-direction: column; +} + // https://github.com/mefechoel/svelte-navigator#what-are-the-weird-rectangles-around-the-headings-in-my-app h1:focus { outline: none; diff --git a/frontend/src/main.ts b/frontend/src/main.ts index 560e2f2..7e2d26a 100644 --- a/frontend/src/main.ts +++ b/frontend/src/main.ts @@ -4,7 +4,7 @@ import "./app.scss"; import App from "./App.svelte"; const app = new App({ - target: document.getElementById("app"), + target: document.body, }); export default app; diff --git a/server/templates/index.html b/server/templates/index.html index a5e6b69..91aa23d 100644 --- a/server/templates/index.html +++ b/server/templates/index.html @@ -14,7 +14,6 @@ -
{% if dev_mode %}