From cbdc0d157d86f5014b8bbb6914ff77983ea5dea3 Mon Sep 17 00:00:00 2001
From: "J. Lewis Muir" <jlmuir@imca-cat.org>
Date: Sun, 6 Sep 2020 16:23:35 -0500
Subject: [PATCH] Improve client footer design

---
 client/src/css/partials/_header.scss | 42 +++++++++++-----------------
 client/src/index.php                 | 10 +++++--
 2 files changed, 23 insertions(+), 29 deletions(-)

diff --git a/client/src/css/partials/_header.scss b/client/src/css/partials/_header.scss
index 5ebeeb53e..11f473da1 100644
--- a/client/src/css/partials/_header.scss
+++ b/client/src/css/partials/_header.scss
@@ -148,44 +148,34 @@
     background: $footer-background url('./stylesheets/images/ispyb_gs_medium.png') center center no-repeat;
     // background: $footer-background inline-image('ispyb_gs_medium.png') center center no-repeat;
     height: 200px;
-    background-position: 50% 85%;
+    background-position: 50% 60%;
     
     @media (max-width: $breakpoint-medium) {
         clear: both;
     }
 
-    .whatnow {
+    .bottom_bar {
         border-top: 1px solid #bbb;
-        font-size: 16px;
+        font-size: 12px;
         font-family: $page-header-font;
-        text-align: center;
+        display: block;
+        padding: 0.5%;
+        color: #222;
+        background: #eee;
+        transition: 0.3s ease-in-out;
 
         a {
-            display: block;
-            padding: 0.5%;
-            color: #222;
-            background: #eee;
-            transition: 0.3s ease-in-out;
+            text-decoration: none;
+        }
 
-            &:hover {
-                color: #000;
-            };
+        .powered_by {
+            float: left;
+            width: 50%;
         }
-    }
 
-    a {
-        color: $footer-color;
-        text-decoration: none;
-        
-        &:hover {
-            color: $footer-hover-color;
+        .site {
+            margin-left: 50%;
+            text-align: right;
         }
     }
-    
-    p {
-        padding: 1%;
-        text-align: center;
-        color: $footer-color;
-        font-size: 10px;
-    }
 }
diff --git a/client/src/index.php b/client/src/index.php
index 8b07dd9d6..812a370a4 100644
--- a/client/src/index.php
+++ b/client/src/index.php
@@ -64,10 +64,14 @@
             </div>
         
             <div id="footer">
-                <div class="whatnow">
-                    <a href="http://diamondlightsource.github.io/SynchWeb/">SynchWeb? What is This?</a>
+                <div class="bottom_bar">
+                    <div class="powered_by">
+                        <p>Powered by <a href="http://diamondlightsource.github.io/SynchWeb/">SynchWeb</a></p>
+                    </div>
+                    <div class="site">
+                        <p><a href="<%= htmlWebpackPlugin.options.jsonConfig.site_link || 'https://www.diamond.ac.uk' %>"><%- htmlWebpackPlugin.options.jsonConfig.site_name || 'Diamond Light Source' %></a> &copy;2013-<script>document.write(new Date().getFullYear())</script></p>
+                    </div>
                 </div>
-                <p><a href="<%= htmlWebpackPlugin.options.jsonConfig.site_link || 'https://www.diamond.ac.uk' %>"><%- htmlWebpackPlugin.options.jsonConfig.site_name || 'Diamond Light Source' %></a> &copy;2013-<script>document.write(new Date().getFullYear())</script></p>
             </div>
         
         </div>