From 1d9c005ca06d0263203968c3a46349c210e88ae6 Mon Sep 17 00:00:00 2001
From: Nils G <nils.gondermann@ruhr-uni-bochum.de>
Date: Tue, 14 Apr 2020 15:57:46 +0200
Subject: [PATCH] Add header to WebClient
---
static/css/base.css | 55 ++++++++++++++++++++++++++++++++++++++++++-
static/css/client.css | 1 -
views/layout.html | 3 +++
3 files changed, 57 insertions(+), 2 deletions(-)
diff --git a/static/css/base.css b/static/css/base.css
index 9677e5f..fb0f5d6 100644
--- a/static/css/base.css
+++ b/static/css/base.css
@@ -1,6 +1,8 @@
/* ============== Color placeholder ===================== */
:root {
+ --bar-bg: grey;
+
--error-bg: #FFBBBB;
--error-text: darkred;
@@ -8,6 +10,56 @@
--info-text: #00004D;
}
+body, html {
+ min-width: 375px;
+}
+
+/* =============== Header =================== */
+#header {
+ position: absolute;
+ display: block;
+
+ text-align: center;
+
+ color: white;
+ font-family: monospace;
+ font-size: 1.7em;
+ font-weight: bold;
+
+ background-color: var(--bar-bg);
+
+ left: 0px;
+ top: 0px;
+ width: 100%;
+ min-width: inherit;
+ height: 30px;
+ line-height: 25px;
+
+ padding: 5px;
+}
+
+#header span {
+ vertical-align: middle;
+}
+
+#header #header_left {
+ margin-left: 15%;
+ float: left;
+}
+
+#header #header_center {
+ margin-left: 10px;
+ margin-right: 10px;
+}
+
+#header #header_right {
+ margin-right: 15%;
+ float: right;
+}
+
+.spacer {
+ margin-bottom: 75px;
+}
/* ============== Popup ===================== */
@@ -58,11 +110,12 @@
left: 0px;
bottom: 0px;
width: 100%;
+ min-width: inherit;
margin-top: 20px;
padding: 5px;
- background-color: gray;
+ background-color: var(--bar-bg);
text-align: center;
}
diff --git a/static/css/client.css b/static/css/client.css
index 3b2af5a..dfca628 100644
--- a/static/css/client.css
+++ b/static/css/client.css
@@ -1,7 +1,6 @@
body {
text-align: center;
background-color: lightgrey;
- padding-top: 50px;
}
#current_content {
diff --git a/views/layout.html b/views/layout.html
index 81b664d..dfd94be 100644
--- a/views/layout.html
+++ b/views/layout.html
@@ -10,6 +10,9 @@
</head>
<body>
+ <div id="header"><span id="header_left"></span><span id="header_center"></span><span id="header_right"></span></div>
+ <div class="spacer"></div>
+
<!-- Page Content -->
{{include}}
<!-- ======================== -->
--
GitLab