From f97ce4fce7e0cfa5150ca680d0fa87d0e96a0763 Mon Sep 17 00:00:00 2001
From: TrueKuehli <rctcoaster2000@hotmail.de>
Date: Sun, 30 Sep 2018 16:15:47 +0200
Subject: Added styling to about page

---
 WebInterface/NodeJSServer/dist/about/index.html | 2 +-
 WebInterface/NodeJSServer/dist/style/about.css  | 1 +
 WebInterface/NodeJSServer/src/style/about.scss  | 5 +++++
 3 files changed, 7 insertions(+), 1 deletion(-)
 create mode 100644 WebInterface/NodeJSServer/dist/style/about.css
 create mode 100644 WebInterface/NodeJSServer/src/style/about.scss

diff --git a/WebInterface/NodeJSServer/dist/about/index.html b/WebInterface/NodeJSServer/dist/about/index.html
index 0caefb2..80fe31e 100644
--- a/WebInterface/NodeJSServer/dist/about/index.html
+++ b/WebInterface/NodeJSServer/dist/about/index.html
@@ -25,7 +25,7 @@
         <a class="menu-option" id="about-tab" href="." target="_blank">About</a>
       </div>
     </div>
-    <div class="container" id="front-layer">
+    <div class="front-layer" id="front-layer">
 
       <!-- TODO: About content here -->
 
diff --git a/WebInterface/NodeJSServer/dist/style/about.css b/WebInterface/NodeJSServer/dist/style/about.css
new file mode 100644
index 0000000..2a7aaab
--- /dev/null
+++ b/WebInterface/NodeJSServer/dist/style/about.css
@@ -0,0 +1 @@
+html,body{height:100vh;margin:0;padding:0;font-family:'Roboto', sans-serif;font-display:swap;overflow:hidden;background-color:#212121;color:#fff;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}body{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;background-color:#546e7a;position:relative}.backdrop{background-color:#546e7a;color:#fff;font-size:1rem}.backdrop .header-bar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@media (max-height: 550px){.backdrop .header-bar{margin-top:0.125rem}}.backdrop .header-bar .menu-icon{background-image:url("../ressources/menu.png");background-position:center;background-repeat:no-repeat;width:36px;height:36px;padding:4px;margin:1rem;display:inline-block;border:none;border-radius:32px;-webkit-transition:background-color 100ms ease;transition:background-color 100ms ease}@media (max-height: 550px){.backdrop .header-bar .menu-icon{padding:0;margin:0.125rem}}.backdrop .header-bar .menu-icon:hover{background-color:#29434e}.backdrop .header-bar .menu-icon.open{background-image:url("../ressources/menu_close.png")}.backdrop .header-bar .header{margin:0;padding:16px;text-align:center;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1}@media (min-width: 450px){.backdrop .header-bar .header{margin-right:56px}}@media (max-height: 550px){.backdrop .header-bar .header{padding:0}}.backdrop .menu-actions{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;transition:max-height 200ms ease, color 200ms ease, background-color 100ms ease;position:relative;max-height:16rem;margin:0 1rem}.backdrop .menu-actions .menu-option{color:#fff;text-decoration:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:inline-block;font-size:1.5rem;width:100%;text-align:center;padding:1rem;border:none;border-radius:8px;cursor:pointer}.backdrop .menu-actions .menu-option:hover{background-color:#3e5864}.backdrop .menu-actions .menu-option.active{background-color:#29434e}.backdrop .menu-actions.hidden{max-height:0;color:rgba(0,0,0,0)}.backdrop .menu-actions.hidden .menu-option{color:rgba(0,0,0,0);background-color:rgba(0,0,0,0) !important}.front-layer{position:relative;border:none;border-radius:16px 16px 0 0;min-height:0;height:100%;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:white;margin-top:8px;-webkit-animation-name:start;animation-name:start;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-timing-function:ease;animation-timing-function:ease;color:black;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@-webkit-keyframes start{from{top:100vh}to{top:0}}@keyframes start{from{top:100vh}to{top:0}}.front-layer .copyright-container{-webkit-box-sizing:border-box;box-sizing:border-box;position:absolute;width:100%;margin:4px;bottom:0;text-align:center}
diff --git a/WebInterface/NodeJSServer/src/style/about.scss b/WebInterface/NodeJSServer/src/style/about.scss
new file mode 100644
index 0000000..9d8ad50
--- /dev/null
+++ b/WebInterface/NodeJSServer/src/style/about.scss
@@ -0,0 +1,5 @@
+@import 'partials/base';
+@import 'partials/backdrop/base';
+@import 'partials/backdrop/menu';
+@import 'partials/front-layer/base';
+@import 'partials/front-layer/copyright';
-- 
cgit v1.2.3-54-g00ecf