[Merton] 2023 cobrand rebranding

templates/email/merton/_email_color_overrides.html

@@ -1,9 +1,9 @@
 [%
 
-color_merton_lavender = '#422d76'
-color_merton_dark_green = '#0c4c57'
-color_merton_pale_green = '#E8F4F1'
-color_merton_jade = '#009578'
+color_merton_lavender = '#5F3E94'
+color_merton_dark_green = '#044925'
+color_merton_pale_green = '#D9F3E5'
+color_merton_jade = '#078141'
 color_merton_grey_g2 = '#e8e8e8'
 
 body_background_color = color_merton_grey_g2
@@ -18,7 +18,7 @@
 button_text_color = color_white
 
 logo_file = 'merton-logo.png'
-logo_width = "88" # pixel measurement, but without 'px' suffix
-logo_height = "51" # pixel measurement, but without 'px' suffix
+logo_width = "220" # pixel measurement, but without 'px' suffix
+logo_height = "50" # pixel measurement, but without 'px' suffix
 
 %]

templates/web/merton/header_extra.html

@@ -1 +1,3 @@
 [% INCLUDE 'tracking_code.html' %]
+<link rel="icon" type="image/png" sizes="32x32" href="/cobrands/merton/images/favicon-32x32.png">
+<link rel="icon" type="image/png" sizes="16x16" href="/cobrands/merton/images/favicon-16x16.png">

web/cobrands/merton/_colours.scss

@@ -1,18 +1,18 @@
 // Nomenclature from Merton's brand guidelines
-$merton-lavender-l1: #32245e;
-$merton-lavender-l2: #422d76;
+$merton-lavender-l1: #4E337A;
+$merton-lavender-l2: #5F3E94;
 $merton-jade-j1: #014c59;
-$merton-jade-j2: #009578;
-$merton-jade-j3: #e8f4f1;
+$merton-jade-j2: #078141;
+$merton-jade-j3: #D9F3E5;
 $merton-grey-g1: #aaa9aa;
 $merton-grey-g2: #e8e8e8;
 $merton-blue-b1: #056eb6;
 $merton-green-g1: #7bbb58;
 $merton-neutrals-n1: #000000;
 $merton-headline: #333333;
-$merton-dark-green: #0c4c57;
+$merton-dark-green: #044925;
 
-$link-color: #167d63;
+$link-color: #078141;
 $link-hover-color: $merton-neutrals-n1;
 
 $primary: $merton-lavender-l1;
@@ -24,7 +24,7 @@ $base_fg: #000;
 
 $nav_background_colour: #fff;
 $nav_colour: #676767;
-$nav_hover_background_colour: #eee;
+$nav_hover_background_colour: #f4f4f4;
 
 $header-top-border-width: 0;
 $header-top-border: none;

web/cobrands/merton/base.scss

@@ -47,7 +47,7 @@ input[type=submit] :not(.item-list__item__shortlist-add) :not(item-list__item__s
 a#geolocate_link,
 :not(.segmented-control--radio) > .btn {
     color: #ffffff !important;
-    background-color: #009578;
+    background-color: $merton-jade-j2;
     background-image: none;
     border-bottom: 2px solid $merton-dark-green;
     border-top-color: transparent;
@@ -96,7 +96,7 @@ input[type=tel],
 input[type=email],
 textarea,
 textarea.form-control {
-    border-bottom: 2px solid #1d9b80 !important;
+    border-bottom: 2px solid #078141 !important;
     border-radius: 0;
     box-shadow: none;
 }
@@ -127,8 +127,8 @@ a.skiplink:focus {
     display: block;
     overflow: hidden;
     white-space: nowrap;
-    padding-top: 70px;
-    width: 116px;
+    padding-top: 60px;
+    width: 220px;
     height: 0;
     background: $merton-lavender-l2 url(/cobrands/merton/images/merton-logo.png) center center no-repeat;
     background-size: contain;
@@ -140,7 +140,7 @@ a {
 
 #report-cta,
 html .nav-menu a.report-a-problem-btn { // overloaded selector to beat _layout.scss
-    background-color: #007F66 !important;
+    background-color: $link-color !important;
     color: white !important;
     border-bottom: 2px solid $merton-dark-green;
     border-radius: 0;
@@ -272,3 +272,8 @@ table.googlecookies {
     }
 }
 
+.form-box,
+.extra-category-questions {
+    background-color: #f4f4f4;
+}
+

web/cobrands/merton/layout.scss

@@ -31,7 +31,7 @@
 }
 
 body.mappage {
-    $merton-header-height: 110px;
+    $merton-header-height: 100px;
     $merton-nav-height: 60px;
 
     #site-header,