From 551453f7cdff077c04b2d36d6f374647ac3106a6 Mon Sep 17 00:00:00 2001
From: Ryan Lerch <rlerch@redhat.com>
Date: Feb 14 2018 22:44:52 +0000
Subject: tighten up page styles


this commit does a bit to the styling of hubs.

* adds a new version of the logo at the top that uses
  monsteratt rather than comfortaa as the font.

* tweaks the side bookmarks / leftmenu bar to fill the entire
  space on the left side, and some tweaks to the styles that show
  the active items and the hovers

* tweak the hub header, these all use the flex utilities now, rather
  than margins and floats. This allows them to be aligned a lot neater.
  the hubname at the top now is also bold -- this is how it appears in
  the mockups.

* added the footer that we use elsewhere on sites that use fedora bootstrap.

---

diff --git a/hubs/static/css/style.css b/hubs/static/css/style.css
index d8dce7f..38a1486 100644
--- a/hubs/static/css/style.css
+++ b/hubs/static/css/style.css
@@ -1,5 +1,4 @@
 body {
-  background-color: #fff;
   overflow-x: hidden;
 }
 
@@ -7,6 +6,8 @@ body {
   background-image: linear-gradient(to bottom,#eee 0%,#ddd 100%);
   background-repeat: repeat-x;
   border-bottom: 1px solid #ccc;
+  box-shadow: 0 0px 8px -4px #888;
+  z-index: 1;
 }
 
 #navbar-top img.chaticon,
@@ -15,6 +16,16 @@ body {
   width: auto;
 }
 
+#page{
+  min-height: 100px;
+}
+
+.footer{
+  /*make the footer colour extend past the bottom of the page
+  for cases where the content is not very tall*/
+  box-shadow: 0px 1000px 0px 1000px #495057;
+}
+
 .showpointer {
   cursor:pointer;
 }
diff --git a/hubs/static/img/logo-hubs.png b/hubs/static/img/logo-hubs.png
index 574c327..04136cb 100644
Binary files a/hubs/static/img/logo-hubs.png and b/hubs/static/img/logo-hubs.png differ
diff --git a/hubs/static/img/logo-hubs.svg b/hubs/static/img/logo-hubs.svg
new file mode 100644
index 0000000..8e89a5b
--- /dev/null
+++ b/hubs/static/img/logo-hubs.svg
@@ -0,0 +1,127 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   version="1.0"
+   width="128"
+   height="36"
+   id="svg6180"
+   sodipodi:docname="logo-hubs.svg"
+   inkscape:version="0.92.2 (5c3e80d, 2017-08-06)"
+   inkscape:export-filename="/home/rlerch/Source/fedora-apps/fedora-hubs/hubs/static/img/logo-hubs.png"
+   inkscape:export-xdpi="73.5"
+   inkscape:export-ydpi="73.5">
+  <metadata
+     id="metadata18">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1136"
+     id="namedview16"
+     showgrid="false"
+     inkscape:snap-page="true"
+     inkscape:snap-bbox="true"
+     inkscape:bbox-nodes="true"
+     inkscape:snap-global="false"
+     inkscape:zoom="4.1397888"
+     inkscape:cx="1.1302954"
+     inkscape:cy="-1.5564221"
+     inkscape:window-x="1920"
+     inkscape:window-y="27"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg6180"
+     showguides="true"
+     inkscape:guide-bbox="true">
+    <sodipodi:guide
+       position="28.695652,18.959627"
+       orientation="0,1"
+       id="guide1006"
+       inkscape:locked="false" />
+    <sodipodi:guide
+       position="30.318323,14.945652"
+       orientation="0,1"
+       inkscape:locked="false"
+       id="guide1008" />
+  </sodipodi:namedview>
+  <defs
+     id="defs6182" />
+  <g
+     transform="matrix(0.98531956,0,0,0.98531956,-438.33033,-340.27507)"
+     id="layer1"
+     style="stroke-width:1.01489913">
+    <g
+       id="g832"
+       style="stroke-width:1.01489913">
+      <path
+         style="fill:#294172;stroke-width:1.01489913"
+         id="path25"
+         d="m 482.01243,363.57426 c 0,-10.06788 -8.16108,-18.22938 -18.22897,-18.22938 -10.06282,0 -18.22179,8.15475 -18.22854,18.21631 l -4.2e-4,-4.2e-4 v 14.1071 l 4.2e-4,4.2e-4 c 0.005,2.28463 1.85832,4.13409 4.14463,4.13409 0.007,0 0.0127,-8.4e-4 0.0194,-8.4e-4 l 10e-4,8.4e-4 h 14.07083 v 0 c 10.06409,-0.004 18.22138,-8.16276 18.22138,-18.22812 z"
+         inkscape:connector-curvature="0" />
+      <path
+         style="fill:#3c6eb4;stroke-width:1.01489913"
+         id="path29"
+         d="m 469.13577,349.66577 c -4.72528,0 -8.55576,3.83049 -8.55576,8.55577 0,0.002 0,0.004 0,0.006 v 4.52836 h -4.51444 c -8.5e-4,0 -8.5e-4,0 -10e-4,0 -4.72528,0 -8.55576,3.81193 -8.55576,8.53678 0,4.72528 3.83048,8.55577 8.55576,8.55577 4.72486,0 8.55534,-3.83049 8.55534,-8.55577 0,-0.002 0,-0.004 0,-0.006 v -4.54733 h 4.51444 c 8.5e-4,0 0.001,0 0.002,0 4.72486,0 8.55534,-3.79296 8.55534,-8.51781 0,-4.72528 -3.83048,-8.55577 -8.55534,-8.55577 z m -8.55576,21.63483 c -0.004,2.48998 -2.02446,4.50811 -4.51571,4.50811 -2.49378,0 -4.53426,-2.02193 -4.53426,-4.5157 0,-2.49421 2.04048,-4.55366 4.53426,-4.55366 0.002,0 0.004,4.2e-4 0.006,4.2e-4 h 3.86971 c 0.001,0 0.002,-4.2e-4 0.003,-4.2e-4 0.35209,0 0.63799,0.28505 0.63799,0.63715 0,4.2e-4 -4.2e-4,8.4e-4 -4.2e-4,10e-4 v 3.92284 h -4.2e-4 z m 8.55534,-8.5448 c -0.001,0 -0.003,0 -0.004,0 h -3.87223 c -8.4e-4,0 -0.002,0 -0.002,0 -0.35252,0 -0.63757,-0.28506 -0.63757,-0.63758 v -4.2e-4 -3.90343 c 0.004,-2.49083 2.02446,-4.50854 4.51571,-4.50854 2.49378,0 4.53468,2.02193 4.53468,4.51613 4.2e-4,2.49336 -2.04048,4.53384 -4.53426,4.53384 z"
+         inkscape:connector-curvature="0" />
+      <path
+         style="fill:#ffffff;stroke-width:1.01489913"
+         id="path31"
+         d="m 460.58001,362.7558 v -4.52836 c 0,-0.002 0,-0.004 0,-0.006 0,-4.72528 3.83048,-8.55577 8.55576,-8.55577 0.71685,0 1.22623,0.0805 1.88952,0.25469 0.96774,0.25385 1.75796,1.04618 1.75838,1.96922 4.2e-4,1.11575 -0.80919,1.92621 -2.0194,1.92621 -0.57642,0 -0.78473,-0.11048 -1.62892,-0.11048 -2.49125,0 -4.51149,2.01771 -4.51571,4.50854 v 3.90385 4.2e-4 c 0,0.35252 0.28505,0.63758 0.63757,0.63758 4.3e-4,0 0.001,0 0.002,0 h 2.96521 c 1.10521,0 1.99747,0.88467 1.99832,1.99283 0,1.10816 -0.89353,1.99114 -1.99832,1.99114 h -3.60489 v 4.54733 c 0,0.002 0,0.004 0,0.006 0,4.72485 -3.83048,8.55534 -8.55534,8.55534 -0.71684,0 -1.22623,-0.0805 -1.88952,-0.25469 -0.96774,-0.25343 -1.75838,-1.04618 -1.7588,-1.9688 0,-1.11575 0.80919,-1.92663 2.01982,-1.92663 0.576,0 0.78473,0.11048 1.6285,0.11048 2.49125,0 4.51191,-2.01771 4.51613,-4.50811 0,0 0,-3.92368 0,-3.9241 0,-0.35168 -0.2859,-0.63673 -0.63799,-0.63673 -4.3e-4,0 -8.5e-4,0 -0.002,0 l -2.96521,-4.2e-4 c -1.10521,0 -1.99831,-0.88214 -1.99831,-1.9903 -4.3e-4,-1.11533 0.90238,-1.99367 2.01939,-1.99367 h 3.58339 v 0 z"
+         inkscape:connector-curvature="0" />
+      <path
+         style="fill:#294172;stroke-width:1.01489913;enable-background:new"
+         id="text6223"
+         d="m 477.41661,378.55292 h 2.81558 v 0.37898 h -1.18152 v 2.94935 h -0.45254 v -2.94935 h -1.18152 v -0.37898 m 3.26144,0 h 0.67101 l 0.84937,2.26496 0.85381,-2.26496 h 0.67102 v 3.32833 h -0.43917 v -2.9226 l -0.85828,2.28279 h -0.45255 l -0.85827,-2.28279 v 2.9226 h -0.43694 v -3.32833"
+         inkscape:connector-curvature="0" />
+    </g>
+  </g>
+  <g
+     aria-label="HUBS"
+     style="font-style:normal;font-weight:normal;font-size:27.82663918px;line-height:7.246521px;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;fill:#888b8e;fill-opacity:0.97647059;stroke:none;stroke-width:1"
+     id="text855"
+     transform="translate(0,1.6909075)">
+    <path
+       d="M 60.685416,7.9520624 V 15.993961 H 50.612173 V 7.9520624 H 46.99471 V 27.43071 h 3.617463 v -8.347992 h 10.073243 v 8.347992 h 3.617463 V 7.9520624 Z"
+       style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-family:Montserrat;-inkscape-font-specification:'Montserrat Semi-Bold';fill:#888b8e;fill-opacity:0.97647059;stroke-width:2.67427778"
+       id="path863"
+       inkscape:connector-curvature="0" />
+    <path
+       d="m 76.21725,27.708976 c 5.314888,0 8.514951,-3.088757 8.514951,-8.765391 V 7.9520624 h -3.56181 V 18.804452 c 0,4.007036 -1.780905,5.732287 -4.925315,5.732287 -3.14441,0 -4.953142,-1.725251 -4.953142,-5.732287 V 7.9520624 H 67.674471 V 18.943585 c 0,5.676634 3.200064,8.765391 8.542779,8.765391 z"
+       style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-family:Montserrat;-inkscape-font-specification:'Montserrat Semi-Bold';fill:#888b8e;fill-opacity:0.97647059;stroke-width:2.67427778"
+       id="path865"
+       inkscape:connector-curvature="0" />
+    <path
+       d="m 101.55071,17.301813 c 1.50264,-0.806972 2.5044,-2.281784 2.5044,-4.285302 0,-3.0887572 -2.5044,-5.0644486 -7.179273,-5.0644486 H 87.7487 V 27.43071 h 9.68367 c 5.0088,0 7.6245,-1.947865 7.6245,-5.287062 0,-2.532224 -1.41916,-4.173995 -3.50616,-4.841835 z M 96.486264,10.79038 c 2.504398,0 3.923556,0.890452 3.923556,2.699184 0,1.780905 -1.419158,2.671357 -3.923556,2.671357 H 91.366163 V 10.79038 Z m 0.723493,13.802013 h -5.843594 v -5.620981 h 5.843594 c 2.727011,0 4.201823,0.862625 4.201823,2.81049 0,1.947865 -1.474812,2.810491 -4.201823,2.810491 z"
+       style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-family:Montserrat;-inkscape-font-specification:'Montserrat Semi-Bold';fill:#888b8e;fill-opacity:0.97647059;stroke-width:2.67427778"
+       id="path867"
+       inkscape:connector-curvature="0" />
+    <path
+       d="m 113.95831,27.708976 c 5.34271,0 7.87494,-2.671357 7.87494,-5.787941 0,-7.151446 -11.54806,-4.452262 -11.54806,-8.598431 0,-1.474812 1.22437,-2.643531 4.22965,-2.643531 1.69742,0 3.61746,0.50088 5.37054,1.530465 l 1.14089,-2.8104903 c -1.69742,-1.1130656 -4.14617,-1.7252517 -6.4836,-1.7252517 -5.34272,0 -7.84712,2.671357 -7.84712,5.815768 0,7.234926 11.57589,4.480089 11.57589,8.681911 0,1.446985 -1.28003,2.532224 -4.31313,2.532224 -2.39309,0 -4.86966,-0.890452 -6.42796,-2.142651 l -1.2522,2.810491 c 1.61395,1.391331 4.64705,2.337437 7.68016,2.337437 z"
+       style="font-style:normal;font-variant:normal;font-weight:600;font-stretch:normal;font-family:Montserrat;-inkscape-font-specification:'Montserrat Semi-Bold';fill:#888b8e;fill-opacity:0.97647059;stroke-width:2.67427778"
+       id="path869"
+       inkscape:connector-curvature="0" />
+  </g>
+</svg>
diff --git a/hubs/static/img/logo_hubs.svg b/hubs/static/img/logo_hubs.svg
deleted file mode 100644
index ea7164e..0000000
--- a/hubs/static/img/logo_hubs.svg
+++ /dev/null
@@ -1,253 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-
-<svg
-   xmlns:dc="http://purl.org/dc/elements/1.1/"
-   xmlns:cc="http://creativecommons.org/ns#"
-   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-   xmlns:svg="http://www.w3.org/2000/svg"
-   xmlns="http://www.w3.org/2000/svg"
-   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
-   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
-   width="38.887249mm"
-   height="10.583333mm"
-   viewBox="0 0 38.887249 10.583333"
-   id="svg2"
-   version="1.1"
-   inkscape:version="0.91 r13725"
-   sodipodi:docname="logo_hubs.svg"
-   inkscape:export-filename="/home/rlerch/Source/fedora-hubs/hubs/static/img/logo-hubs.png"
-   inkscape:export-xdpi="192"
-   inkscape:export-ydpi="192">
-  <defs
-     id="defs4">
-    <clipPath
-       clipPathUnits="userSpaceOnUse"
-       id="clipPath4574">
-      <circle
-         style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#ce5c00;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:0.75063962;stroke-linecap:butt;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
-         id="circle4576"
-         cx="93.498596"
-         cy="-16.921354"
-         r="5.5046906"
-         transform="rotate(60)" />
-    </clipPath>
-  </defs>
-  <sodipodi:namedview
-     id="base"
-     pagecolor="#ffffff"
-     bordercolor="#666666"
-     borderopacity="1.0"
-     inkscape:pageopacity="0.0"
-     inkscape:pageshadow="2"
-     inkscape:zoom="1"
-     inkscape:cx="33.725636"
-     inkscape:cy="8.9793668"
-     inkscape:document-units="mm"
-     inkscape:current-layer="layer1"
-     showgrid="false"
-     fit-margin-top="0"
-     fit-margin-left="0"
-     fit-margin-right="0"
-     fit-margin-bottom="0"
-     inkscape:window-width="1920"
-     inkscape:window-height="1136"
-     inkscape:window-x="0"
-     inkscape:window-y="27"
-     inkscape:window-maximized="1" />
-  <metadata
-     id="metadata7">
-    <rdf:RDF>
-      <cc:Work
-         rdf:about="">
-        <dc:format>image/svg+xml</dc:format>
-        <dc:type
-           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
-        <dc:title></dc:title>
-      </cc:Work>
-    </rdf:RDF>
-  </metadata>
-  <g
-     inkscape:label="Layer 1"
-     inkscape:groupmode="layer"
-     id="layer1"
-     transform="translate(-48.766898,-31.073162)">
-    <g
-       id="g4714">
-      <g
-         transform="matrix(0.45619308,0,0,0.45619308,25.303771,-9.145808)"
-         id="g4595">
-        <g
-           transform="matrix(0.92003825,0,0,0.92003825,3.8994993,8.9046582)"
-           id="g4624">
-          <text
-             transform="matrix(1.4613695,0,0,1.4613695,-4.7135332,46.848388)"
-             xml:space="preserve"
-             style="font-style:normal;font-weight:normal;font-size:8.11766624px;line-height:125%;font-family:Sans;letter-spacing:0px;word-spacing:0px;fill:#555753;fill-opacity:1;stroke:none;stroke-width:0.20294166px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
-             x="59.199654"
-             y="40.575024"
-             id="text4225"
-             sodipodi:linespacing="125%"><tspan
-               sodipodi:role="line"
-               id="tspan4227"
-               x="59.199654"
-               y="40.575024"
-               style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-family:Montserrat;-inkscape-font-specification:Montserrat;fill:#555753;fill-opacity:1;stroke-width:0.20294166px">HUBS</tspan></text>
-          <g
-             id="g4488"
-             transform="matrix(0.13021808,0,0,0.13021808,82.276708,87.323483)">
-            <g
-               id="layer1-0"
-               transform="translate(-266.55899,-345.34488)">
-              <path
-                 style="fill:#3c6eb4"
-                 id="path11"
-                 d="m 316.7736,397.581 c 0,0 0,0 -20.53889,0 0.3327,4.45245 3.92157,7.77609 8.70715,7.77609 3.38983,0 6.31456,-1.39616 8.64094,-3.65507 0.46553,-0.46679 0.99726,-0.59962 1.59519,-0.59962 0.79781,0 1.59561,0.39932 2.12692,1.06388 0.3327,0.46553 0.53216,0.99726 0.53216,1.52857 0,0.73118 -0.3327,1.52857 -0.93106,2.12734 -2.7919,2.99052 -7.51086,4.98503 -12.16403,4.98503 -8.44149,0 -15.22074,-6.77967 -15.22074,-15.22158 0,-8.44149 6.58022,-15.22074 15.02171,-15.22074 8.37529,0 14.62323,6.51317 14.62323,15.08749 0,1.26418 -1.12924,2.12861 -2.39258,2.12861 z m -12.23065,-11.76512 c -4.45329,0 -7.51085,2.92473 -8.17499,7.17731 10.03626,0 16.35083,0 16.35083,0 -0.59836,-4.05355 -3.78874,-7.17731 -8.17584,-7.17731 z"
-                 inkscape:connector-curvature="0" />
-              <path
-                 style="fill:#3c6eb4"
-                 id="path13"
-                 d="m 375.46344,410.80807 c -8.44106,0 -15.22074,-6.77968 -15.22074,-15.22159 0,-8.44149 6.77968,-15.22074 15.22074,-15.22074 8.44234,0 15.22159,6.77925 15.22159,15.22074 -4.2e-4,8.44149 -6.77968,15.22159 -15.22159,15.22159 z m 0,-24.65992 c -5.31688,0 -8.77377,4.25427 -8.77377,9.43833 0,5.18364 3.45689,9.43833 8.77377,9.43833 5.31731,0 8.77504,-4.25469 8.77504,-9.43833 -4.2e-4,-5.18406 -3.45773,-9.43833 -8.77504,-9.43833 z"
-                 inkscape:connector-curvature="0" />
-              <path
-                 style="fill:#3c6eb4"
-                 id="path15"
-                 d="m 412.66183,380.36574 c -4.45963,0 -7.40966,1.319 -10.01391,4.62956 l -0.24036,-1.53995 0,0 c -0.20198,-1.60743 -1.57326,-2.84926 -3.23382,-2.84926 -1.80139,0 -3.26206,1.459 -3.26206,3.26081 0,0.003 0,0.005 0,0.008 l 0,0 0,0.003 0,0 0,23.40712 c 0,1.79464 1.46194,3.25743 3.257,3.25743 1.79465,0 3.25744,-1.46279 3.25744,-3.25743 l 0,-12.56209 c 0,-5.71621 4.98502,-8.57432 10.23613,-8.57432 1.59519,0 2.85726,-1.32953 2.85726,-2.92515 0,-1.59561 -1.26207,-2.85726 -2.85768,-2.85726 z"
-                 inkscape:connector-curvature="0" />
-              <path
-                 style="fill:#3c6eb4"
-                 id="path17"
-                 d="m 447.02614,395.58648 c 0.0666,-8.17541 -5.78326,-15.22074 -15.222,-15.22074 -8.44192,0 -15.28779,6.77925 -15.28779,15.22074 0,8.44191 6.64684,15.22159 14.68985,15.22159 4.01434,0 7.62682,-2.06621 9.23846,-4.22518 l 0.79359,2.01434 0,0 c 0.42589,1.13177 1.5176,1.93717 2.7978,1.93717 1.65001,0 2.98756,-1.33671 2.99009,-2.98545 l 0,0 0,-7.80687 0,0 0,-4.1556 z m -15.222,9.43833 c -5.31773,0 -8.77419,-4.25469 -8.77419,-9.43833 0,-5.18406 3.45604,-9.43833 8.77419,-9.43833 5.3173,0 8.77419,4.25427 8.77419,9.43833 0,5.18364 -3.45689,9.43833 -8.77419,9.43833 z"
-                 inkscape:connector-curvature="0" />
-              <path
-                 style="fill:#3c6eb4"
-                 id="path19"
-                 d="m 355.01479,368.3337 c 0,-1.7938 -1.46194,-3.18997 -3.25659,-3.18997 -1.79422,0 -3.25743,1.39659 -3.25743,3.18997 l 0,17.1499 c -1.66097,-3.05756 -5.25026,-5.11786 -9.50495,-5.11786 -8.64052,0 -14.42336,6.51318 -14.42336,15.22074 0,8.70757 5.98229,15.22159 14.42336,15.22159 3.76555,0 7.03057,-1.55429 8.98587,-4.25554 l 0.72317,1.83428 c 0.44782,1.25912 1.64917,2.16024 3.06051,2.16024 1.78621,0 3.24984,-1.45435 3.24984,-3.24815 0,-0.005 0,-0.009 0,-0.0139 l 0,0 0,-38.95128 -4.2e-4,0 z m -15.22116,36.69111 c -5.31731,0 -8.70715,-4.25469 -8.70715,-9.43833 0,-5.18406 3.38984,-9.43833 8.70715,-9.43833 5.31773,0 8.70714,4.0544 8.70714,9.43833 0,5.38309 -3.38941,9.43833 -8.70714,9.43833 z"
-                 inkscape:connector-curvature="0" />
-              <path
-                 style="fill:#3c6eb4"
-                 id="path21"
-                 d="m 287.21553,365.34023 c -0.59414,-0.0877 -1.19966,-0.13198 -1.80097,-0.13198 -6.73118,0 -12.20746,5.4767 -12.20746,12.20788 l 0,3.8132 -3.98903,0 c -1.46237,0 -2.65908,1.19671 -2.65908,2.65781 0,1.46321 1.19671,2.93738 2.65908,2.93738 l 3.98819,0 0,20.46004 c 0,1.79464 1.46236,3.25743 3.25658,3.25743 1.79507,0 3.25744,-1.46279 3.25744,-3.25743 l 0,-20.46004 4.40986,0 c 1.46194,0 2.65823,-1.47417 2.65823,-2.93738 0,-1.46152 -1.19629,-2.65823 -2.65823,-2.65823 l -4.40733,0 0,-3.8132 c 0,-3.13852 2.55323,-6.11469 5.69175,-6.11469 0.28294,0 0.56757,0.0211 0.84672,0.062 1.78031,0.26355 3.4358,-0.54269 3.70019,-2.32342 0.2627,-1.77904 -0.96606,-3.43538 -2.74594,-3.69935 z"
-                 inkscape:connector-curvature="0" />
-            </g>
-            <path
-               style="fill:#294172;enable-background:new"
-               id="path2391"
-               d="m 181.98344,61.675273 2.81558,0 0,0.37898 -1.18152,0 0,2.94935 -0.45254,0 0,-2.94935 -1.18152,0 0,-0.37898 m 3.26144,0 0.67101,0 0.84937,2.26496 0.85381,-2.26496 0.67102,0 0,3.32833 -0.43917,0 0,-2.9226 -0.85828,2.28279 -0.45255,0 -0.85827,-2.28279 0,2.9226 -0.43694,0 0,-3.32833"
-               inkscape:connector-curvature="0" />
-          </g>
-        </g>
-      </g>
-    </g>
-    <path
-       style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#3465a4;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:0.31506309;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
-       d="M 8.6191406 3.4980469 L 7.7265625 4.1699219 L 14.023438 12.560547 C 14.291168 12.2999 14.572508 12.057879 14.871094 11.835938 L 8.6191406 3.4980469 z M 28.880859 4.5917969 L 24.427734 11.716797 C 24.742969 11.920204 25.047311 12.138844 25.333984 12.378906 L 29.830078 5.1875 L 28.880859 4.5917969 z M 19.386719 6.6757812 L 18.273438 6.7851562 L 18.625 10.341797 C 18.934929 10.305579 19.250168 10.28125 19.574219 10.28125 C 19.631633 10.28125 19.686977 10.287983 19.744141 10.289062 L 19.386719 6.6757812 z M 19.574219 12.322266 C 19.32096 12.322266 19.070316 12.337075 18.824219 12.363281 L 19.365234 17.830078 L 15.986328 13.324219 C 15.667163 13.516812 15.362813 13.730843 15.080078 13.970703 L 18.833984 18.972656 L 13.121094 16.701172 C 12.98469 17.044848 12.871838 17.40117 12.791016 17.769531 L 17.697266 19.720703 L 12.625 21.205078 L 12.625 21.796875 L 12.625 22.367188 L 18.777344 20.564453 L 14.115234 26.21875 L 15.558594 26.21875 L 19.669922 21.236328 L 20.001953 26.197266 C 20.380191 26.174218 20.750145 26.123675 21.109375 26.042969 L 20.785156 21.208984 L 24.058594 24.580078 C 24.342769 24.340094 24.605473 24.077151 24.847656 23.794922 L 21.574219 20.425781 L 26.248047 21.197266 C 26.349896 20.842083 26.424239 20.476015 26.46875 20.099609 L 21.960938 19.353516 L 26.179688 17.113281 C 26.063571 16.755305 25.917897 16.411578 25.748047 16.082031 L 21.65625 18.259766 L 24.242188 14.125 C 23.964835 13.87337 23.667275 13.643915 23.351562 13.439453 L 20.507812 17.990234 L 19.947266 12.339844 C 19.822736 12.333262 19.700446 12.322266 19.574219 12.322266 z M 32.382812 12.550781 L 27.542969 15.126953 C 27.714672 15.455553 27.861521 15.797747 27.992188 16.148438 L 32.902344 13.541016 L 32.382812 12.550781 z M 6.9296875 14.240234 L 6.5214844 15.277344 L 10.583984 16.892578 L 10.583984 16.730469 L 10.837891 16.994141 L 11.392578 17.214844 C 11.486387 16.851437 11.595421 16.494068 11.724609 16.146484 L 6.9296875 14.240234 z M 28.126953 20.375 C 28.074825 20.747649 27.998258 21.111997 27.90625 21.470703 L 34.396484 22.542969 L 34.578125 21.443359 L 28.126953 20.375 z M 10.583984 21.802734 L 3.6777344 23.824219 L 3.9882812 24.896484 L 10.583984 22.964844 L 10.583984 21.802734 z M 26.105469 25.089844 C 25.870846 25.380941 25.625044 25.660021 25.357422 25.917969 L 28.820312 29.484375 L 29.623047 28.710938 L 26.105469 25.089844 z M 21.248047 28.09375 C 20.888857 28.166383 20.516063 28.207613 20.138672 28.232422 L 20.507812 33.742188 L 21.623047 33.666016 L 21.248047 28.09375 z M 12.560547 28.105469 L 11.166016 29.796875 L 12.023438 30.501953 L 13.873047 28.259766 L 13.427734 28.259766 L 13.414062 28.259766 L 13.054688 28.259766 L 12.994141 28.208984 C 12.845055 28.186127 12.701352 28.150827 12.560547 28.105469 z "
-       transform="matrix(0.28222224,0,0,0.28222224,48.766898,31.073161)"
-       id="path4769" />
-    <path
-       style="fill:#ffffff;stroke:#ffffff;stroke-width:0.30319569;stroke-miterlimit:4;stroke-dasharray:none"
-       id="path4791"
-       d="m 57.554918,32.601226 c 0,-0.339586 -0.27527,-0.61487 -0.614856,-0.61487 -0.339415,0 -0.614614,0.275057 -0.614842,0.614429 l -1.4e-5,-1.5e-5 0,0.475828 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.139441 0.139797,0.139441 2.34e-4,0 4.22e-4,-2.9e-5 6.56e-4,-2.9e-5 l 3.4e-5,2.9e-5 0.474603,0 0,0 c 0.339458,-1.35e-4 0.6146,-0.275327 0.6146,-0.614827 z"
-       inkscape:connector-curvature="0" />
-    <path
-       style="fill:#ffffff;stroke:#ffffff;stroke-width:0.30319569;stroke-miterlimit:4;stroke-dasharray:none"
-       id="path4793"
-       d="m 58.668834,34.866188 c 0,-0.339586 -0.27527,-0.61487 -0.614856,-0.61487 -0.339415,0 -0.614614,0.275058 -0.614841,0.614429 l -1.5e-5,-1.4e-5 0,0.475828 1.5e-5,1.4e-5 c 1.71e-4,0.07706 0.06268,0.13944 0.139796,0.13944 2.35e-4,0 4.22e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.4e-5,2.8e-5 0.474604,0 0,0 c 0.339457,-1.34e-4 0.614599,-0.275326 0.614599,-0.614827 z"
-       inkscape:connector-curvature="0" />
-    <path
-       style="fill:#ffffff;stroke:#ffffff;stroke-width:0.30319569;stroke-miterlimit:4;stroke-dasharray:none"
-       id="path4795"
-       d="m 59.1144,37.316804 c 0,-0.339586 -0.27527,-0.61487 -0.614856,-0.61487 -0.339415,0 -0.614613,0.275058 -0.614841,0.614429 l -1.4e-5,-1.4e-5 0,0.475827 1.4e-5,1.5e-5 c 1.72e-4,0.07706 0.06268,0.13944 0.139797,0.13944 2.34e-4,0 4.21e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.3e-5,2.8e-5 0.474604,0 0,0 c 0.339458,-1.34e-4 0.6146,-0.275326 0.6146,-0.614827 z"
-       inkscape:connector-curvature="0" />
-    <path
-       style="fill:#ffffff;stroke:#ffffff;stroke-width:0.30319569;stroke-miterlimit:4;stroke-dasharray:none"
-       id="path4797"
-       d="m 57.74057,39.321853 c 0,-0.339585 -0.27527,-0.614869 -0.614856,-0.614869 -0.339414,0 -0.614613,0.275056 -0.614841,0.614429 l -1.4e-5,-1.6e-5 0,0.475827 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.139443 0.139797,0.139443 2.34e-4,0 4.21e-4,-2.9e-5 6.56e-4,-2.9e-5 l 3.3e-5,2.9e-5 0.474604,0 0,0 c 0.339458,-1.36e-4 0.6146,-0.275327 0.6146,-0.614828 z"
-       inkscape:connector-curvature="0" />
-    <path
-       style="fill:#ffffff;stroke:#ffffff;stroke-width:0.30319569;stroke-miterlimit:4;stroke-dasharray:none"
-       id="path4799"
-       d="m 55.252824,40.547161 c 0,-0.339585 -0.27527,-0.614869 -0.614856,-0.614869 -0.339414,0 -0.614613,0.275056 -0.614841,0.614429 l -1.4e-5,-1.6e-5 0,0.475827 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.139442 0.139797,0.139442 2.34e-4,0 4.22e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.4e-5,2.8e-5 0.474603,0 0,0 c 0.339458,-1.35e-4 0.6146,-0.275326 0.6146,-0.614827 z"
-       inkscape:connector-curvature="0" />
-    <path
-       style="fill:#ffffff;stroke:#ffffff;stroke-width:0.30319569;stroke-miterlimit:4;stroke-dasharray:none"
-       id="path4801"
-       d="m 52.181451,40.104467 c 0,-0.339587 -0.27527,-0.61487 -0.614856,-0.61487 -0.339414,0 -0.614613,0.275056 -0.614841,0.614428 l -1.4e-5,-1.4e-5 0,0.475827 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.13944 0.139797,0.13944 2.34e-4,0 4.22e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.4e-5,2.8e-5 0.474603,0 0,0 c 0.339458,-1.34e-4 0.6146,-0.275326 0.6146,-0.614825 z"
-       inkscape:connector-curvature="0" />
-    <path
-       style="fill:#ffffff;stroke:#ffffff;stroke-width:0.30319569;stroke-miterlimit:4;stroke-dasharray:none"
-       id="path4803"
-       d="m 50.611507,37.985154 c 0,-0.339585 -0.27527,-0.614869 -0.614856,-0.614869 -0.339415,0 -0.614614,0.275056 -0.614841,0.614429 l -1.4e-5,-1.6e-5 0,0.475827 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.139442 0.139796,0.139442 2.35e-4,0 4.22e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.4e-5,2.8e-5 0.474604,0 0,0 c 0.339457,-1.36e-4 0.614599,-0.275326 0.614599,-0.614827 z"
-       inkscape:connector-curvature="0" />
-    <path
-       style="fill:#ffffff;stroke:#ffffff;stroke-width:0.30319569;stroke-miterlimit:4;stroke-dasharray:none"
-       id="path4805"
-       d="m 51.168465,35.237494 c 0,-0.339585 -0.27527,-0.614869 -0.614856,-0.614869 -0.339415,0 -0.614613,0.275056 -0.614841,0.614429 l -1.4e-5,-1.6e-5 0,0.475828 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.139442 0.139797,0.139442 2.34e-4,0 4.21e-4,-3e-5 6.56e-4,-3e-5 l 3.3e-5,3e-5 0.474604,0 0,0 c 0.339457,-1.36e-4 0.6146,-0.275328 0.6146,-0.614828 z"
-       inkscape:connector-curvature="0" />
-    <path
-       style="fill:#ffffff;stroke:#ffffff;stroke-width:0.30319569;stroke-miterlimit:4;stroke-dasharray:none"
-       id="path4807"
-       d="m 51.762554,32.22992 c 0,-0.339585 -0.27527,-0.614869 -0.614856,-0.614869 -0.339415,0 -0.614614,0.275056 -0.614842,0.614429 l -1.4e-5,-1.5e-5 0,0.475827 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.139441 0.139797,0.139441 2.34e-4,0 4.22e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.4e-5,2.8e-5 0.474603,0 0,0 c 0.339458,-1.34e-4 0.6146,-0.275326 0.6146,-0.614827 z"
-       inkscape:connector-curvature="0" />
-    <path
-       inkscape:connector-curvature="0"
-       d="m 54.732997,32.786878 c 0,-0.339585 -0.27527,-0.614869 -0.614856,-0.614869 -0.339415,0 -0.614614,0.275056 -0.614841,0.614429 l -1.5e-5,-1.5e-5 0,0.475827 1.5e-5,1.4e-5 c 1.71e-4,0.07706 0.06268,0.139441 0.139796,0.139441 2.35e-4,0 4.22e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.4e-5,2.8e-5 0.474604,0 0,0 c 0.339457,-1.34e-4 0.614599,-0.275326 0.614599,-0.614827 z"
-       id="path4809"
-       style="fill:#ffffff;stroke:#ffffff;stroke-width:0.30319569;stroke-miterlimit:4;stroke-dasharray:none" />
-    <path
-       inkscape:connector-curvature="0"
-       d="m 56.540131,36.512176 c 0,-1.242182 -1.006917,-2.249152 -2.249097,-2.249152 -1.241555,0 -2.248213,1.006137 -2.249045,2.247538 l -5.2e-5,-5.4e-5 0,1.740539 5.2e-5,5e-5 c 6.58e-4,0.281881 0.22928,0.510069 0.511365,0.510069 8.52e-4,0 0.0015,-1.04e-4 0.0024,-1.04e-4 l 1.23e-4,1.04e-4 1.736064,0 0,0 c 1.241712,-3.87e-4 2.248161,-1.007128 2.248161,-2.24899 z"
-       id="path25"
-       style="fill:#888a85" />
-    <path
-       inkscape:connector-curvature="0"
-       d="m 57.554918,32.601226 c 0,-0.339586 -0.27527,-0.61487 -0.614856,-0.61487 -0.339415,0 -0.614614,0.275057 -0.614842,0.614429 l -1.4e-5,-1.5e-5 0,0.475828 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.139441 0.139797,0.139441 2.34e-4,0 4.22e-4,-2.9e-5 6.56e-4,-2.9e-5 l 3.4e-5,2.9e-5 0.474603,0 0,0 c 0.339458,-1.35e-4 0.6146,-0.275327 0.6146,-0.614827 z"
-       id="path4773"
-       style="fill:#888a85;fill-opacity:1" />
-    <path
-       inkscape:connector-curvature="0"
-       d="m 58.668834,34.866188 c 0,-0.339586 -0.27527,-0.61487 -0.614856,-0.61487 -0.339415,0 -0.614614,0.275058 -0.614841,0.614429 l -1.5e-5,-1.4e-5 0,0.475828 1.5e-5,1.4e-5 c 1.71e-4,0.07706 0.06268,0.13944 0.139796,0.13944 2.35e-4,0 4.22e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.4e-5,2.8e-5 0.474604,0 0,0 c 0.339457,-1.34e-4 0.614599,-0.275326 0.614599,-0.614827 z"
-       id="path4775"
-       style="fill:#888a85;fill-opacity:1" />
-    <path
-       inkscape:connector-curvature="0"
-       d="m 59.1144,37.316804 c 0,-0.339586 -0.27527,-0.61487 -0.614856,-0.61487 -0.339415,0 -0.614613,0.275058 -0.614841,0.614429 l -1.4e-5,-1.4e-5 0,0.475827 1.4e-5,1.5e-5 c 1.72e-4,0.07706 0.06268,0.13944 0.139797,0.13944 2.34e-4,0 4.21e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.3e-5,2.8e-5 0.474604,0 0,0 c 0.339458,-1.34e-4 0.6146,-0.275326 0.6146,-0.614827 z"
-       id="path4777"
-       style="fill:#888a85;fill-opacity:1" />
-    <path
-       inkscape:connector-curvature="0"
-       d="m 57.74057,39.321853 c 0,-0.339585 -0.27527,-0.614869 -0.614856,-0.614869 -0.339414,0 -0.614613,0.275056 -0.614841,0.614429 l -1.4e-5,-1.6e-5 0,0.475827 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.139443 0.139797,0.139443 2.34e-4,0 4.21e-4,-2.9e-5 6.56e-4,-2.9e-5 l 3.3e-5,2.9e-5 0.474604,0 0,0 c 0.339458,-1.36e-4 0.6146,-0.275327 0.6146,-0.614828 z"
-       id="path4779"
-       style="fill:#888a85;fill-opacity:1" />
-    <path
-       inkscape:connector-curvature="0"
-       d="m 55.252824,40.547161 c 0,-0.339585 -0.27527,-0.614869 -0.614856,-0.614869 -0.339414,0 -0.614613,0.275056 -0.614841,0.614429 l -1.4e-5,-1.6e-5 0,0.475827 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.139442 0.139797,0.139442 2.34e-4,0 4.22e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.4e-5,2.8e-5 0.474603,0 0,0 c 0.339458,-1.35e-4 0.6146,-0.275326 0.6146,-0.614827 z"
-       id="path4781"
-       style="fill:#888a85;fill-opacity:1" />
-    <path
-       inkscape:connector-curvature="0"
-       d="m 52.181451,40.104467 c 0,-0.339587 -0.27527,-0.61487 -0.614856,-0.61487 -0.339414,0 -0.614613,0.275056 -0.614841,0.614428 l -1.4e-5,-1.4e-5 0,0.475827 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.13944 0.139797,0.13944 2.34e-4,0 4.22e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.4e-5,2.8e-5 0.474603,0 0,0 c 0.339458,-1.34e-4 0.6146,-0.275326 0.6146,-0.614825 z"
-       id="path4783"
-       style="fill:#888a85;fill-opacity:1" />
-    <path
-       inkscape:connector-curvature="0"
-       d="m 50.611507,37.985154 c 0,-0.339585 -0.27527,-0.614869 -0.614856,-0.614869 -0.339415,0 -0.614614,0.275056 -0.614841,0.614429 l -1.4e-5,-1.6e-5 0,0.475827 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.139442 0.139796,0.139442 2.35e-4,0 4.22e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.4e-5,2.8e-5 0.474604,0 0,0 c 0.339457,-1.36e-4 0.614599,-0.275326 0.614599,-0.614827 z"
-       id="path4785"
-       style="fill:#888a85;fill-opacity:1" />
-    <path
-       inkscape:connector-curvature="0"
-       d="m 51.168465,35.237494 c 0,-0.339585 -0.27527,-0.614869 -0.614856,-0.614869 -0.339415,0 -0.614613,0.275056 -0.614841,0.614429 l -1.4e-5,-1.6e-5 0,0.475828 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.139442 0.139797,0.139442 2.34e-4,0 4.21e-4,-3e-5 6.56e-4,-3e-5 l 3.3e-5,3e-5 0.474604,0 0,0 c 0.339457,-1.36e-4 0.6146,-0.275328 0.6146,-0.614828 z"
-       id="path4787"
-       style="fill:#888a85;fill-opacity:1" />
-    <path
-       inkscape:connector-curvature="0"
-       d="m 51.762554,32.22992 c 0,-0.339585 -0.27527,-0.614869 -0.614856,-0.614869 -0.339415,0 -0.614614,0.275056 -0.614842,0.614429 l -1.4e-5,-1.5e-5 0,0.475827 1.4e-5,1.4e-5 c 1.72e-4,0.07706 0.06268,0.139441 0.139797,0.139441 2.34e-4,0 4.22e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.4e-5,2.8e-5 0.474603,0 0,0 c 0.339458,-1.34e-4 0.6146,-0.275326 0.6146,-0.614827 z"
-       id="path4789"
-       style="fill:#888a85;fill-opacity:1" />
-    <path
-       style="fill:#888a85;fill-opacity:1"
-       id="path4771"
-       d="m 54.732997,32.786878 c 0,-0.339585 -0.27527,-0.614869 -0.614856,-0.614869 -0.339415,0 -0.614614,0.275056 -0.614841,0.614429 l -1.5e-5,-1.5e-5 0,0.475827 1.5e-5,1.4e-5 c 1.71e-4,0.07706 0.06268,0.139441 0.139796,0.139441 2.35e-4,0 4.22e-4,-2.8e-5 6.56e-4,-2.8e-5 l 3.4e-5,2.8e-5 0.474604,0 0,0 c 0.339457,-1.34e-4 0.614599,-0.275326 0.614599,-0.614827 z"
-       inkscape:connector-curvature="0" />
-  </g>
-</svg>
diff --git a/hubs/templates/master.html b/hubs/templates/master.html
index 15aaa70..166ea75 100644
--- a/hubs/templates/master.html
+++ b/hubs/templates/master.html
@@ -14,7 +14,7 @@
   <link rel="icon" type="image/png"
       href="{{ url_for('static', filename='img/favicon.png') }}">
 </head>
-<body>
+<body class="bg-white">
 
 <nav class="navbar navbar-expand-md navbar-light" id="navbar-top">
 
@@ -186,6 +186,16 @@
 </div> <!-- /.container-fluid -->
 {% endblock fullcontent %}
 
+<div class="container-fluid footer py-5">
+    <p class="text-muted text-center">
+      Copyright © 2018 Red Hat, Inc. and others.<br/>
+      <a href="https://pagure.io/fedora-hubs/">
+      Fedora Hubs</a> is Free Software.
+      Please <a href="https://pagure.io/fedora-hubs/issues">
+      file issues</a> if you have any problems.
+    </p>
+  </div>
+
 {% block jscripts %}
 <script src="{{ url_for('static', filename='js/jquery-1.10.2.min.js') }}"></script>
 <script src="https://apps.fedoraproject.org/global/fedora-bootstrap-1.1.1/fedora-bootstrap.min.js"></script>
diff --git a/js/app/components/HubHeader/HubHeaderLeft.js b/js/app/components/HubHeader/HubHeaderLeft.js
index 4c06c36..263b73e 100644
--- a/js/app/components/HubHeader/HubHeaderLeft.js
+++ b/js/app/components/HubHeader/HubHeaderLeft.js
@@ -10,27 +10,29 @@ class HubHeaderLeft extends React.Component {
 
   render() {
     return (
-      <div className="HubHeaderLeft h-100">
-        <HubStats
-          hub={this.props.hub}
-          />
-        <div>
+      <div className="HubHeaderLeft d-flex h-100">
+        <div className="d-flex mr-auto">
           <HubAvatar
             name={this.props.hub.name}
             avatar={this.props.hub.config.avatar}
             />
-          <h2 className="user pt-0">
-            {this.props.hub.name}
-            {((this.props.hub.type === "team") || 
-              (this.props.hub.type === "user" && this.props.hub.name !== this.props.currentUser.nickname)) &&
-              <HubStar />
-            }
-          </h2>
-          <h5 className="mt-1 mb-1">
-            {this.props.hub.config.summary}
-          </h5>
+          <div className="align-self-center">
+            <h3 className="user pt-0 font-weight-bold">
+              {this.props.hub.name}
+              {((this.props.hub.type === "team") || 
+                (this.props.hub.type === "user" && this.props.hub.name !== this.props.currentUser.nickname)) &&
+                <HubStar />
+              }
+            </h3>
+            <h5>
+              {this.props.hub.config.summary}
+            </h5>
+          </div>
           <div className="clearfix"></div>
         </div>
+        <HubStats
+          hub={this.props.hub}
+          />
       </div>
     );
   }
diff --git a/js/app/components/HubHeader/HubHeaderRight.js b/js/app/components/HubHeader/HubHeaderRight.js
index c0f2e2a..4244e02 100644
--- a/js/app/components/HubHeader/HubHeaderRight.js
+++ b/js/app/components/HubHeader/HubHeaderRight.js
@@ -9,7 +9,7 @@ export default class HubHeaderRight extends React.Component {
 
   render() {
     return (
-      <div className="HubHeaderRight mt-2">
+      <div className="HubHeaderRight ml-auto align-self-center">
         <HubMembership />
         { this.props.hub.perms.config &&
           <span>
diff --git a/js/app/components/HubHeader/HubStar.css b/js/app/components/HubHeader/HubStar.css
index 63a8d08..3370d8e 100644
--- a/js/app/components/HubHeader/HubStar.css
+++ b/js/app/components/HubHeader/HubStar.css
@@ -1,5 +1,4 @@
 .HubStar {
-    line-height: 2rem;
     font-size: 1.2rem;
     color: #aaa;
     z-index: 1; /* Above the left menu */
diff --git a/js/app/components/HubHeader/HubStats.js b/js/app/components/HubHeader/HubStats.js
index 4420cfe..8aae332 100644
--- a/js/app/components/HubHeader/HubStats.js
+++ b/js/app/components/HubHeader/HubStats.js
@@ -10,7 +10,7 @@ export default class HubStats extends React.Component {
       return null;
     }
     return (
-      <div className="HubStats d-flex float-right mt-2">
+      <div className="HubStats d-flex">
         { (this.props.hub.type === "team") &&
           <HubStatsCounter
             title="Members"
diff --git a/js/app/components/HubHeader/StreamHeaderRight.js b/js/app/components/HubHeader/StreamHeaderRight.js
index d1bf5e6..d750261 100644
--- a/js/app/components/HubHeader/StreamHeaderRight.js
+++ b/js/app/components/HubHeader/StreamHeaderRight.js
@@ -6,7 +6,7 @@ export default class StreamHeaderRight extends React.Component {
 
   render() {
     return (
-      <div className="StreamHeaderRight">
+      <div className="StreamHeaderRight ml-auto align-self-center">
         <EditModeButton />
       </div>
     );
diff --git a/js/app/components/HubHeader/index.js b/js/app/components/HubHeader/index.js
index f5fe120..f3765f2 100644
--- a/js/app/components/HubHeader/index.js
+++ b/js/app/components/HubHeader/index.js
@@ -37,12 +37,12 @@ class HubHeader extends React.Component {
         }
         { isLoaded &&
           <div className="row">
-            <div className={`col-md-${left_width} pl-0`}>
+            <div className={`col-md-${left_width}`}>
               <HeaderLeft
                 hub={this.props.hub}
                 />
             </div>
-            <div className={`col-md-${right_width} text-right`}>
+            <div className={`col-md-${right_width} d-flex`}>
               <HeaderRight
                 hub={this.props.hub}
                 />
diff --git a/js/app/components/LeftMenu.css b/js/app/components/LeftMenu.css
index 3962997..e0fd154 100644
--- a/js/app/components/LeftMenu.css
+++ b/js/app/components/LeftMenu.css
@@ -1,23 +1,24 @@
 .LeftMenu {
   width: 100%;
-  padding: 0.5rem 15px;
-  z-index: 1;
-}
-@media (min-width: 992px) {
-  .LeftMenu {
-    position: absolute;
-    padding: 0.5rem 30px 0 0;
-  }
+  height:100%;
+  background-color: #fcfcfc;
+  border-right: 1px solid #bbb;
+  box-shadow: inset -7px 0 9px -7px rgba(0,0,0,0.2);
 }
 
+
 .LeftMenu .nav {
-  background-color: #fcfcfc;
-  border: 1px solid #dddddd;
+  height:100%;
 }
 
 .LeftMenu a.nav-link {
   color: #373a3c;
   font-size: 85%;
+  border-radius: 0px;  
+}
+
+.LeftMenu .nav-item {
+  position: relative;
 }
 
 .LeftMenu a.nav-link.active {
@@ -26,8 +27,23 @@
 }
 
 .LeftMenu a.nav-link:hover {
-  background-color: #eee;
+  background-color: rgba(0,0,0,0.1);
 }
 .LeftMenu a.nav-link.active:hover {
   background-color: #007bff;
 }
+
+.LeftMenu .nav-link.active:after {
+  border-top: 18px solid transparent;
+  border-bottom: 18px solid transparent;
+  border-left: 5px solid #3c6eb4;
+  position: absolute;
+  content: "";
+  right: -5px;
+  top: 0;
+  z-index: 1;
+}
+
+.LeftMenu .nav-link.active:hover:after{
+  border-left: 5px solid #007bff;
+}
diff --git a/js/app/components/PageStructure.js b/js/app/components/PageStructure.js
index 5db92ca..3c19d8e 100644
--- a/js/app/components/PageStructure.js
+++ b/js/app/components/PageStructure.js
@@ -9,26 +9,28 @@ export default class PageStructure extends React.Component {
   render() {
     return (
       <div className={this.props.cssClass}>
-        <header className="container-fluid">
+        <div className="container-fluid m-0 px-0">
           <FlashMessages />
-          <div className="row">
+          <div className="row no-gutters p-0">
             <div className="col-lg-2">
               <LeftMenu />
             </div>
-            <div className="col-lg-10">
-              {this.props.header}
-            </div>
-          </div>
-        </header>
-
-        <div className="container-fluid">
-          <div className="row">
-            <div className="col-lg-10 ml-auto px-0">
-              {this.props.content}
+            <div className="col-lg-10 pb-4">
+              <header className="pt-0">
+                <div className="row">
+                  <div className="col-12">
+                    {this.props.header}
+                  </div>
+                </div>
+              </header>
+              <div className="row">
+                <div className="col-12">
+                  {this.props.content}
+                </div>
+              </div>
             </div>
           </div>
         </div>
-
         <Heartbeat />
       </div>
     );