diff --git a/client/src/app.tsx b/client/src/app.tsx
index 8cecb10..f2fb562 100755
--- a/client/src/app.tsx
+++ b/client/src/app.tsx
@@ -2,6 +2,7 @@ import React, {Component, Fragment, ReactNode} from 'react';
import Menu from './components/menu';
import {Notifier} from './components/notifier';
import Error from './components/error';
+import Footer from './components/footer';
import {initRouter} from './router';
import log from './utils/log';
import Button from './components/button';
@@ -61,6 +62,8 @@ class App extends Component<{}, State> {
+
+
>
);
}
diff --git a/client/src/components/footer.scss b/client/src/components/footer.scss
new file mode 100644
index 0000000..c3e7cc9
--- /dev/null
+++ b/client/src/components/footer.scss
@@ -0,0 +1,8 @@
+@import '../scss/settings.scss';
+
+#footer {
+ height: $footer-height;
+ text-align: center;
+ z-index: 1;
+}
+
diff --git a/client/src/components/footer.tsx b/client/src/components/footer.tsx
new file mode 100644
index 0000000..29b3aa9
--- /dev/null
+++ b/client/src/components/footer.tsx
@@ -0,0 +1,10 @@
+import './footer.scss';
+import React from 'react';
+
+export default function Footer() {
+ if (process.env.REACT_APP_FOOTER) {
+ document.body.style.setProperty("--footer-height", "17px");
+ return
;
+ }
+ return null;
+}
diff --git a/client/src/scss/index.scss b/client/src/scss/index.scss
index 86bcf7f..cfe6e7c 100755
--- a/client/src/scss/index.scss
+++ b/client/src/scss/index.scss
@@ -36,7 +36,7 @@ html {
#shell {
display: flex;
- min-height: calc(100vh - 55px);
+ min-height: calc(100vh - 55px - $footer-height);
}
#menu {
diff --git a/client/src/scss/settings.scss b/client/src/scss/settings.scss
index f17833d..157843e 100755
--- a/client/src/scss/settings.scss
+++ b/client/src/scss/settings.scss
@@ -37,6 +37,8 @@ $media-xsmall: 700px;
$media-small: 812px;
$media-medium: 1200px;
+$footer-height: var(--footer-height);
+
body {
--color-lightest: #F0F0F0;
--color-light: #AAA;
@@ -52,6 +54,8 @@ body {
--color-icon-inactive: #{$color-dark};
--box-shadow-size: 4px;
+
+ --footer-height: 0px;
}
body.dark-mode {