Factor out some CSS colours, so that default layout CSS has no overrides.

19 files changed, 93 insertions, 129 deletions

diff --git a/web/cobrands/barnet/_colours.scss b/web/cobrands/barnet/_colours.scss
index 793a8dcdd..2a00dab90 100644
--- a/web/cobrands/barnet/_colours.scss
+++ b/web/cobrands/barnet/_colours.scss
@@ -4,6 +4,13 @@ $primary: #E9E9EA;
 $primary_b: #000000;
 $primary_text: #3E3D44;
 
+/* Unused here */
+$base_bg: #fff;
+$base_fg: #1a1a1a;
+$map_nav_bg: #222;
+$nav_fg: #fff;
+$nav_fg_hover: #444;
+
 $col_click_map: #E1E3E4;
 $col_click_map_dark: darken(#E1E3E4, 10%);
 
diff --git a/web/cobrands/bromley/_colours.scss b/web/cobrands/bromley/_colours.scss
index 208154370..5627929a0 100644
--- a/web/cobrands/bromley/_colours.scss
+++ b/web/cobrands/bromley/_colours.scss
@@ -6,6 +6,14 @@ $primary: $bromley_blue;
 $primary_b: #000000;
 $primary_text: #ffffff;
 
+$base_bg: #9b9b9b url('https://www.bromley.gov.uk/site/styles/css_img/repeater.gif') repeat-x;
+$base_fg: #1a1a1a;
+
+/* Unused here */
+$map_nav_bg: #222;
+$nav_fg: #fff;
+$nav_fg_hover: #444;
+
 $col_click_map: $bromley_blue;
 $col_click_map_dark: darken($bromley_blue, 10%);
 $col_fixed_label: $bromley_blue;
diff --git a/web/cobrands/bromley/layout.scss b/web/cobrands/bromley/layout.scss
index b898f5791..f5e6e9801 100644
--- a/web/cobrands/bromley/layout.scss
+++ b/web/cobrands/bromley/layout.scss
@@ -1,7 +1,6 @@
 @import "_colours";
 @import "../sass/layout";
 
-body { background: #9b9b9b url('https://www.bromley.gov.uk/site/styles/css_img/repeater.gif') repeat-x; }
 #bromley-wrapper { background: #fff url('https://www.bromley.gov.uk/site/styles/css_img/header-corners.gif') center 110px no-repeat; margin: 1px auto 0; padding: 0 15px; width: 955px;}
 .offline #bromley-wrapper { padding: 0 15px 20px; }
 
diff --git a/web/cobrands/default/_colours.scss b/web/cobrands/default/_colours.scss
index 147fb70f2..e8c12f98e 100644
--- a/web/cobrands/default/_colours.scss
+++ b/web/cobrands/default/_colours.scss
@@ -7,6 +7,13 @@ $primary: $orange;
 $primary_b: #000000;
 $primary_text: #222222;
 
+$base_bg: $bluey;
+$base_fg: #000;
+
+$map_nav_bg: $bluey;
+$nav_fg: #000;
+$nav_fg_hover: $primary;
+
 $col_click_map: $bluey;
 $col_click_map_dark: darken($bluey, 10%);
 
diff --git a/web/cobrands/default/layout.scss b/web/cobrands/default/layout.scss
index 5d1fab968..69e455aa5 100644
--- a/web/cobrands/default/layout.scss
+++ b/web/cobrands/default/layout.scss
@@ -1,39 +1,2 @@
 @import "_colours";
 @import "../sass/layout";
-
-/*
-Note: The fact that the below has to override the CSS, though it is for the
-default template, is a sign that the CSS is not best organised. It needs
-refactoring, and making more maintainable through the use of SMACSS, OOCSS
-and similar.
-*/
-
-body {
-    background: $bluey;
-}
-
-body.mappage {
-    .nav-wrapper {
-        .nav-wrapper-2 {
-            background: $bluey;
-        }
-    }
-}
-
-#main-nav {
-    ul {
-        li {
-            a, span {
-                color: #000;
-            }
-        }
-        &#main-menu {
-            li {
-                a:hover {
-                    background: $primary;
-                }
-            }
-        }
-    }
-}
-
diff --git a/web/cobrands/fixmindelo/_colours.scss b/web/cobrands/fixmindelo/_colours.scss
index cb261cff3..ac39f72e3 100644
--- a/web/cobrands/fixmindelo/_colours.scss
+++ b/web/cobrands/fixmindelo/_colours.scss
@@ -10,6 +10,13 @@ $primary: $mindelo_blue;
 $primary_b: #000000;
 $primary_text: #222222;
 
+$base_bg: #fff url(images/tropical-sea-pattern.jpg);
+$base_fg: $primary_text;
+
+$map_nav_bg: #fff;
+$nav_fg: #000;
+$nav_fg_hover: $primary;
+
 $col_click_map: $mindelo_green;
 $col_click_map_dark: darken($mindelo_green, 10%);
 
diff --git a/web/cobrands/fixmindelo/layout.scss b/web/cobrands/fixmindelo/layout.scss
index 502ac29f3..6e1180e2b 100644
--- a/web/cobrands/fixmindelo/layout.scss
+++ b/web/cobrands/fixmindelo/layout.scss
@@ -6,12 +6,8 @@ $image-sprite: 'images/sprite.png';
 
 
 body {
-  background-color: #fff;
-  background-image: url(images/tropical-sea-pattern.jpg);
-  color: $primary_text;
-  
   .wrapper{
-  background-color: #fff;
+    background-color: #fff;
     background: url('images/fixmindelo-header.png') 30% 0% repeat-x;
   }
   #site-logo {
@@ -19,30 +15,13 @@ body {
   }
 }
 
-
-body.mappage {
-    .nav-wrapper {
-        .nav-wrapper-2 {
-            background: #fff;
-        }
-    }
-}
-
 #main-nav {
     ul {
-        li {
-            a, span {
-                color: #000;
-            }
-        }
         &#main-menu {
             li {
                 a.report-a-problem-btn {
                   color: #fff;
                 }
-                a:hover {
-                    background: $primary;
-                }
             }
         }
     }
diff --git a/web/cobrands/fixmybarangay/_colours.scss b/web/cobrands/fixmybarangay/_colours.scss
index bbf419bca..d5544ff07 100644
--- a/web/cobrands/fixmybarangay/_colours.scss
+++ b/web/cobrands/fixmybarangay/_colours.scss
@@ -4,6 +4,13 @@ $primary: #fff; //E6DBD6
 $primary_b: #000000;
 $primary_text: #222222;
 
+$base_bg: #C7B299 url(images/pat3.png);
+$base_fg: $primary_text;
+
+$map_nav_bg: url('images/fmb-header.png') 30% 0% repeat-x;
+$nav_fg: #fff;
+$nav_fg_hover: rgba(0,0,0,0.8);
+
 $col_click_map: #00BD08;
 $col_click_map_dark: #4B8304;
 $col_fixed_label: #00BD08;
@@ -11,4 +18,4 @@ $col_fixed_label_dark: #4B8304;
 
 $fmb_base_blue: #046AAA;
 $fmb_dark_blue: #084E7A;
-$fmb_tab_yellow: #FFD000;
\ No newline at end of file
+$fmb_tab_yellow: #FFD000;
diff --git a/web/cobrands/fixmybarangay/base.scss b/web/cobrands/fixmybarangay/base.scss
index 9088efa71..81cf4785d 100644
--- a/web/cobrands/fixmybarangay/base.scss
+++ b/web/cobrands/fixmybarangay/base.scss
@@ -26,11 +26,6 @@ input.yellow-btn{
   }
 }
 
-body.mappage .nav-wrapper div.nav-wrapper-2 {
-  background: url('images/fmb-header.png') 30% 0% repeat-x;
-  border-bottom: 2px solid #333;
-}
-
 #main-nav ul#main-menu li a.report-a-problem-btn:hover {
   background: #fff;
 }
diff --git a/web/cobrands/fixmybarangay/layout.scss b/web/cobrands/fixmybarangay/layout.scss
index 675a185b1..4a662754d 100644
--- a/web/cobrands/fixmybarangay/layout.scss
+++ b/web/cobrands/fixmybarangay/layout.scss
@@ -13,10 +13,6 @@ $image-sprite: 'images/sprite.png';
 }
 
 body {
-  background: #C7B299;
-  background-image: url(images/pat3.png);
-  color: $primary_text;
-  
   .wrapper{
     background: url('images/fmb-header.png') 30% 0% repeat-x;
   }
@@ -44,6 +40,10 @@ body.frontpage {
     background-image: url(images/ie_front_logo.gif);
 }
 
+body.mappage .nav-wrapper div.nav-wrapper-2 {
+  border-bottom: 2px solid #333;
+}
+
 #main-nav ul#mysoc-menu li a#mysoc-logo {
   background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIkAAAAyCAMAAABf9whNAAAA0lBMVEUAAABAQEBAQEBAQEBNTU1NTU1AQEBNTU1AQEBAQEBAQEBAQEBAQEBAQEBAQEBNTU1NTU1AQEBNTU1AQEBNTU1AQEBAQEBNTU2Mxj9NTU33kx5NTU1NTU1NTU3tHCRmLZEpq+JNTU2TJ4/tHCSTJ4/87iEpq+L3kx5NTU387iH87iHtHCSTJ4/3kx51K5CTJ49mLZGMxj/tHCSx0zVmLZH6wSBmLZFmLZFDdb/zYCFbuZGMxj/3kx5AQEBNTU0pq+LtHCSMxj/3kx787iFmLZGTJ49ns3BGAAAAPXRSTlMAQL+AQIAQECBwMGBQj98gn5/Pr+/vzzC/r79wYI9wv69QcK+vcICfv68QQBAwj0AwMBBggIBQr3BwgEBgSmaQCwAAAflJREFUeF7t1Ndy2zAQhtGfAAX2IpFUseSSOLGd3nt27bT3f6UsQHusRFcKmVxkcGa4wvCG34AQ8V/wPM/zPM8zSaOaxGBHtFpF+IfikqwYO0LmELfiHH/XlLokSBrsiurtPdGkMJJFWFWTSQUZC0RhWMFNRQWuvTw9RS/VOolNEBgAudYpkE5pHqRpEACIZQ4x4RkztxMWd6KWa2DDvFDUBeg9urr6cPAZMIqEDogCmDmJKdwtlbjXOCc1sIRnhyxj0vIMNbeQMUNun5DBOTo6/3oASMhUF6krka3IM1lkikqdGaICMVE2sKSNICkR1sxYyMag5TWQd7bFPH4G8eT8zcOUKIGwJUYuSE7hzoldlZAwM7Dkwg4GQjtmXMtvBZHNiZJ7P+5C3P/2oH9SXyKXo1yJq0sbmmLMkg23h7xCryR1W5L8WqKsmz1BSbqjfNSSiMUGMEB/Bp8ePwdeLF/ZAn1TEssFR1MJIZmyGLUENXNrI8pCK6IMx99fn50tvyyBcuvEKuqKXDcuocgAQ/I7conMGgA5BfD23fvLy4/LT0Ba/v4vphRxR9dnlmIMU4ULO0IgsgPr/rya3H7F4JycoCf3sq0vW5ICiLXO3YtsMC4JqbG3uCFKMSb3nYuwNyLKMK6Q6wj7a7oMY4vwJwwG8TzP8zzP834CEcRJKkEhVogAAAAASUVORK5CYII=");
 }
@@ -72,18 +72,6 @@ body.frontpage {
         }
         &#main-menu{
           padding: 3px 0;
-          li{
-            a{
-              //@extend .report-a-problem-btn;
-              color: #fff;
-              padding: 0.7em;
-              background-color: rgba(0,0,0,0);
-              background-image: none;
-              &:hover{
-                background-color: rgba(0,0,0,0.8);
-              }
-            }
-          }
         }
         
     }
diff --git a/web/cobrands/fixmystreet/_colours.scss b/web/cobrands/fixmystreet/_colours.scss
index 7dcd9ab9b..b04ea8692 100644
--- a/web/cobrands/fixmystreet/_colours.scss
+++ b/web/cobrands/fixmystreet/_colours.scss
@@ -4,6 +4,14 @@ $primary: #FFD000;
 $primary_b: #F3B11E; // For the box around the front page postcode form only
 $primary_text: #222;
 
+// Tiled main body background
+$base_bg: #1A1A1A url(/cobrands/fixmystreet/images/tile.jpg) 0 0 repeat;
+$base_fg: #fff;
+
+$map_nav_bg: #222;
+$nav_fg: #fff;
+$nav_fg_hover: #444;
+
 // The "Click map" box on /around
 $col_click_map: #00BD08;
 $col_click_map_dark: #4B8304;
diff --git a/web/cobrands/fixmystreet/layout.scss b/web/cobrands/fixmystreet/layout.scss
index bc61f09e4..3bb8509e4 100644
--- a/web/cobrands/fixmystreet/layout.scss
+++ b/web/cobrands/fixmystreet/layout.scss
@@ -66,17 +66,18 @@ h3, h4 {
 @import "_colours";
 @import "../sass/layout";
 
-// Tiled main body background
-body {
-    background: #1A1A1A url(/cobrands/fixmystreet/images/tile.jpg) 0 0 repeat;
-    color: #fff;
-}
-
 // Tiled background stripe, not plain colour
 #front-main {
     background: $primary url(/cobrands/fixmystreet/images/tile-y.jpg);
 }
 #main-nav {
+    ul#main-menu {
+        li {
+            a:hover {
+                @include background(linear-gradient(#000, #444 10%, #444 95%, #111));
+            }
+        }
+    }
     ul#mysoc-menu {
         background: $primary url(/cobrands/fixmystreet/images/tile-y.jpg);
     }
@@ -86,4 +87,10 @@ body {
         @include border-image(url(/cobrands/fixmystreet/images/tile-y-border.jpg) 4 0 0 0);
     }
 }
-
+body.mappage {
+    .nav-wrapper {
+        .nav-wrapper-2 {
+              @include background(linear-gradient(#000, #222 10%, #222 90%, #000));
+        }
+    }
+}
diff --git a/web/cobrands/oxfordshire/_colours.scss b/web/cobrands/oxfordshire/_colours.scss
index eea046781..900f96d3d 100644
--- a/web/cobrands/oxfordshire/_colours.scss
+++ b/web/cobrands/oxfordshire/_colours.scss
@@ -7,6 +7,14 @@ $primary: $oxfordshire_lt_green;
 $primary_b: $oxfordshire_dk_green;
 $primary_text: #fff;
 
+$base_bg: #fff;
+$base_fg: #000;
+
+/* Unused here */
+$map_nav_bg: #222;
+$nav_fg: #fff;
+$nav_fg_hover: #444;
+
 $col_click_map: $oxfordshire_lt_green;
 $col_click_map_dark: $primary_text;
 
diff --git a/web/cobrands/oxfordshire/layout.scss b/web/cobrands/oxfordshire/layout.scss
index 7dc6b8be6..ff7f9b373 100644
--- a/web/cobrands/oxfordshire/layout.scss
+++ b/web/cobrands/oxfordshire/layout.scss
@@ -1,11 +1,6 @@
 @import "_colours";
 @import "../sass/layout";
 
-body {
-  background-color: #fff;
-  background-image: none;
-}
-
 body, body a {
   font-family:"Trebuchet MS",Arial, Helvetica, sans-serif; 
 }
diff --git a/web/cobrands/sass/_layout.scss b/web/cobrands/sass/_layout.scss
index 565e7d4d8..b580f1927 100644
--- a/web/cobrands/sass/_layout.scss
+++ b/web/cobrands/sass/_layout.scss
@@ -12,8 +12,8 @@ $image-sprite: '/cobrands/fixmystreet/images/sprite.png' !default;
 }
 
 body {
-    background: #1A1A1A;
-    color: #fff;
+    color: $base_fg;
+    background: $base_bg;
 }
 
 /* The OpenLayers popup sets a background image with a white background without setting the CSS colours correctly. */
@@ -137,7 +137,7 @@ h1 {
       a,
       span {
         display: block;
-        color:#fff;
+        color: $nav_fg;
         background: none;  
         border-bottom: none;      
       }
@@ -149,8 +149,7 @@ h1 {
           font-size: 0.9em;
         }
         a:hover{
-          background:#444;
-          @include background(linear-gradient(#000, #444 10%, #444 95%, #111));
+          background: $nav_fg_hover;
         }
         a.report-a-problem-btn {
           color: $primary_text;
@@ -242,8 +241,7 @@ body.mappage {
   .nav-wrapper{
     .nav-wrapper-2{
       position: fixed;
-      background: #222;
-      @include background(linear-gradient(#000, #222 10%, #222 90%, #000));
+      background: $map_nav_bg;
     }
   }
   #site-logo{
diff --git a/web/cobrands/stevenage/_colours.scss b/web/cobrands/stevenage/_colours.scss
index 219f1066a..6b0d1bcdd 100644
--- a/web/cobrands/stevenage/_colours.scss
+++ b/web/cobrands/stevenage/_colours.scss
@@ -5,6 +5,13 @@ $primary: #066539;
 $primary_b: $primary;
 $primary_text: #fff;
 
+$base_bg: #dddddb;
+$base_fg: #222;
+
+$map_nav_bg: #6b6969;
+$nav_fg: #fff;
+$nav_fg_hover: #444;
+
 $col_click_map: #00BD08;
 $col_click_map_dark: #4B8304;
 $col_fixed_label: #00BD08;
diff --git a/web/cobrands/stevenage/layout.scss b/web/cobrands/stevenage/layout.scss
index 91499c5a4..07429b302 100644
--- a/web/cobrands/stevenage/layout.scss
+++ b/web/cobrands/stevenage/layout.scss
@@ -4,11 +4,6 @@
 // d523b431 - "Stevenage Home page styles"
 // 2a23e09f - Moved menu on map page and reverted to full header.
 
-body {
-    color: #222;
-    background: #dddddb;
-}
-
 // d523b431
 .nav-wrapper{
   .nav-wrapper-2{
@@ -60,9 +55,6 @@ body {
                     margin: 0;
                     @include border-radius(0.25em);
                 }
-                a:hover {
-                    background: #444;
-                }
                 a.report-a-problem-btn {
                     padding:0.5em 0.75em;
                     margin:0;
@@ -113,7 +105,6 @@ body.mappage {
             width: 29em;
             padding-top: 0.15em;
             z-index: 0;
-            background-color: #6b6969;
             @include background(linear-gradient(#6b6969, #555454));
         }
     }
diff --git a/web/cobrands/zurich/_colours.scss b/web/cobrands/zurich/_colours.scss
index e2a2587f0..8ae175583 100644
--- a/web/cobrands/zurich/_colours.scss
+++ b/web/cobrands/zurich/_colours.scss
@@ -7,6 +7,15 @@ $primary: $zurich_blue;
 $primary_b: $dark_blue;
 $primary_text: #fff;
 
+$base_bg: #fff;
+$base_fg: #3c3c3c;
+
+$map_nav_bg: #fff;
+/* Unused here, main-nav is mobile only */
+$nav_fg: $primary_text;
+$nav_fg_hover: $primary/1.1;
+
+
 $col_click_map: $zurich_blue;
 $col_click_map_dark: darken($zurich_blue, 20%);
 
diff --git a/web/cobrands/zurich/layout.scss b/web/cobrands/zurich/layout.scss
index 7984de0b9..03f8b3143 100644
--- a/web/cobrands/zurich/layout.scss
+++ b/web/cobrands/zurich/layout.scss
@@ -4,11 +4,6 @@
 
 // Things to override from parent stylesheet
 
-body {
-    color: #3c3c3c;
-    background-color: #fff;
-}
-
 // White background, so no shadow or margin needed.
 .content {
     color: #3c3c3c;
@@ -104,7 +99,6 @@ body.mappage {
     .nav-wrapper {
         .nav-wrapper-2 {
             border-top: none;
-            background: #fff;
             height: 117px; // 99px+18px for padding
             padding: 0 10px;
             box-sizing: border-box;
@@ -155,19 +149,6 @@ body.mappage {
   }
 }
 
-#main-nav {
-    ul#main-menu {
-        li {
-            a:hover {
-                background: $primary/1.1;
-            }
-            span {
-                color: $primary_text;
-            }
-        }
-    }
-}
-
 #zurich-main-nav {
   margin: -1em -1em 1em -1em; // -1em spreads back out over content's 1em padding
   padding: 0;