Merge branch 'bexley'

19 files changed, 504 insertions, 145 deletions

diff --git a/web/cobrands/bathnes/assets.js b/web/cobrands/bathnes/assets.js
index 16ecb3076..fd1386480 100644
--- a/web/cobrands/bathnes/assets.js
+++ b/web/cobrands/bathnes/assets.js
@@ -33,7 +33,7 @@ fixmystreet.maps.banes_defaults = {
 };
 
 
-fixmystreet.assets.add($.extend(true, {}, fixmystreet.maps.banes_defaults, {
+fixmystreet.assets.add(fixmystreet.maps.banes_defaults, {
     http_options: {
         params: {
             TYPENAME: "Gritbins"
@@ -44,9 +44,9 @@ fixmystreet.assets.add($.extend(true, {}, fixmystreet.maps.banes_defaults, {
     attributes: {
         asset_details: 'feature_location'
     }
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, fixmystreet.maps.banes_defaults, {
+fixmystreet.assets.add(fixmystreet.maps.banes_defaults, {
     http_options: {
         params: {
             TYPENAME: "ParksOpenSpacesAssets"
@@ -91,7 +91,7 @@ fixmystreet.assets.add($.extend(true, {}, fixmystreet.maps.banes_defaults, {
         'Seats'
     ],
     name: "Parks and Grounds"
-}));
+});
 
 
 
@@ -190,7 +190,7 @@ var lighting_stylemap = new OpenLayers.StyleMap({
 });
 
 
-fixmystreet.assets.add($.extend(true, {}, fixmystreet.maps.banes_defaults, {
+fixmystreet.assets.add(fixmystreet.maps.banes_defaults, {
     http_options: {
         params: {
             TYPENAME: "StreetLighting"
@@ -211,7 +211,7 @@ fixmystreet.assets.add($.extend(true, {}, fixmystreet.maps.banes_defaults, {
                    "description: " + a.unitdescription;
         }
     }
-}));
+});
 
 
 var highways_stylemap = new OpenLayers.StyleMap({
@@ -221,7 +221,7 @@ var highways_stylemap = new OpenLayers.StyleMap({
     })
 });
 
-fixmystreet.assets.add($.extend(true, {}, fixmystreet.maps.banes_defaults, {
+fixmystreet.assets.add(fixmystreet.maps.banes_defaults, {
     http_options: {
         params: {
             TYPENAME: "AdoptedHighways"
@@ -236,7 +236,7 @@ fixmystreet.assets.add($.extend(true, {}, fixmystreet.maps.banes_defaults, {
     },
     name: "Adopted Highways",
     attribution: " © Crown Copyright. All rights reserved. 1000233344"
-}));
+});
 
 
 })();
diff --git a/web/cobrands/bathnes/js.js b/web/cobrands/bathnes/js.js
index afc7df44d..51c8bcfed 100644
--- a/web/cobrands/bathnes/js.js
+++ b/web/cobrands/bathnes/js.js
@@ -26,13 +26,13 @@ fixmystreet.roadworks.filter = function(feature) {
 
 var org_id = '114';
 var body = "Bath and North East Somerset Council";
-fixmystreet.assets.add($.extend(true, {}, fixmystreet.roadworks.layer_future, {
+fixmystreet.assets.add(fixmystreet.roadworks.layer_future, {
     http_options: { params: { organisation_id: org_id } },
     body: body
-}));
-fixmystreet.assets.add($.extend(true, {}, fixmystreet.roadworks.layer_planned, {
+});
+fixmystreet.assets.add(fixmystreet.roadworks.layer_planned, {
     http_options: { params: { organisation_id: org_id } },
     body: body
-}));
+});
 
 })();
diff --git a/web/cobrands/bathnes/staff.js b/web/cobrands/bathnes/staff.js
index c6a8a9560..1f9aa6e6e 100644
--- a/web/cobrands/bathnes/staff.js
+++ b/web/cobrands/bathnes/staff.js
@@ -21,7 +21,7 @@ var llpg_stylemap = new OpenLayers.StyleMap({
 });
 
 
-fixmystreet.assets.add($.extend(true, {}, fixmystreet.maps.banes_defaults, {
+fixmystreet.assets.add(fixmystreet.maps.banes_defaults, {
     http_options: {
         params: {
             TYPENAME: "LLPG"
@@ -32,7 +32,7 @@ fixmystreet.assets.add($.extend(true, {}, fixmystreet.maps.banes_defaults, {
     stylemap: llpg_stylemap,
     non_interactive: true,
     always_visible: true
-}));
+});
 
 
 // Some normally-invisible layers are visible to staff, so replace their
diff --git a/web/cobrands/bexley/_colours.scss b/web/cobrands/bexley/_colours.scss
new file mode 100644
index 000000000..e2c1657bb
--- /dev/null
+++ b/web/cobrands/bexley/_colours.scss
@@ -0,0 +1,53 @@
+/* COLOURS */
+
+$menu-image: 'menu-white';
+
+$mappage-header-height: 128px;
+
+$white: #fff;
+
+$red: #B10E1E;
+
+$royal: #2E358B;
+$fuchsia: #912B88;
+$aqua: #00A1B3;
+$spring: #5DA70E;
+
+$royal_lt: #B3B7E6;
+$fuchsia_lt: #E9AFE5;
+$aqua_lt: #00CCCC;
+$sprint_lt: #B8E26A;
+
+$text_black: #0B0C0C;
+$text_grey: #6F777B;
+
+$link: #005EA5;
+$hover: #2B8CC4;
+$visited: #4C2C92;
+$focus: #FFBF47;
+
+$grey_border: #BFC1C3;
+$grey_panel: #DEE0E2;
+$grey_highlight: #F8F8F8;
+
+$col_button: #00823B;
+$col_button_hover: #006435;
+
+$primary: $grey_highlight;
+$primary_b: $royal;
+$primary_text: $text_black;
+
+$base_bg: $white;
+$base_fg: $text_black;
+
+$nav_background_colour: $fuchsia;
+$nav_colour: $white;
+$nav_hover_background_colour: darken($fuchsia, 10%);
+
+$col_click_map: $aqua;
+
+$header-top-border: false;
+
+$heading-font: Lato, sans-serif;
+$body-font: Lato, sans-serif;
+$meta-font: $body-font;
diff --git a/web/cobrands/bexley/base.scss b/web/cobrands/bexley/base.scss
new file mode 100644
index 000000000..bedd5b21b
--- /dev/null
+++ b/web/cobrands/bexley/base.scss
@@ -0,0 +1,125 @@
+@import "../sass/h5bp";
+@import "./_colours";
+@import "../sass/mixins";
+@import "../sass/base";
+
+div.form-error, p.form-error { // TODO Add to more, make a variable.
+    background-color: $red;
+}
+
+/* Font overrides */
+
+#front-main h2 {
+    font-style: normal;
+}
+
+/* .form-control has this already, make sure buttons etc caught too */
+input {
+    font-family: inherit;
+}
+
+/* Size */
+
+body {
+    font-size: 1.125em;
+}
+
+small {
+    font-size: 0.89em;
+}
+.meta-2 {
+    font-size: 0.89em;
+}
+#key-tools a,button {
+    font-size: 0.89em;
+}
+.btn--small {
+    font-size: 0.89em;
+}
+.mobile-map-banner {
+    font-size: 0.89em;
+}
+#front-main a#geolocate_link {
+    font-size: 0.89em;
+}
+#front_stats div {
+    font-size: 0.89em;
+}
+.description_tips ul {
+    font-size: 0.89em;
+    line-height: 1.4;
+}
+
+.report-list-filters {
+    font-size: 0.89em;
+    .form-control {
+        font-size: 1em;
+    }
+}
+.multi-select-menuitem, .multi-select-button {
+    font-size: 1em;
+}
+
+/* Colour overrides */
+
+.description_tips .do {
+    color: $col_button_hover;
+}
+.description_tips .dont {
+    color: $red;
+}
+
+a,
+.fake-link {
+  text-decoration: none;
+  color: $link;
+
+  &:visited {
+    color: $visited;
+  }
+
+  &:hover,
+  &:active {
+    text-decoration: underline;
+    color: $hover;
+  }
+
+  &:focus {
+    color: $focus;
+  }
+}
+
+.dz-clickable .dz-message u {
+  color: $link;
+}
+
+.btn-primary,
+.green-btn,
+.btn--primary {
+    border: none;
+    background: $col_button;
+
+    &:focus,
+    &:hover,
+    &:active {
+        background: $col_button_hover;
+    }
+}
+
+ol.big-numbers > li:before {
+    color: $fuchsia_lt;
+}
+
+/* Header */
+
+#site-logo {
+    width: 150px;
+    height: 60px;
+    padding: 1em 0;
+    background: url(/cobrands/bexley/images/logo.png) 0 50% no-repeat;
+    background-size: 150px 60px;
+}
+
+#postcodeForm .form-hint {
+//    color: $white;
+}
diff --git a/web/cobrands/bexley/images/logo.png b/web/cobrands/bexley/images/logo.png
new file mode 100644
index 000000000..8051ac80d
--- /dev/null
+++ b/web/cobrands/bexley/images/logo.png
diff --git a/web/cobrands/bexley/js.js b/web/cobrands/bexley/js.js
new file mode 100644
index 000000000..580320325
--- /dev/null
+++ b/web/cobrands/bexley/js.js
@@ -0,0 +1,157 @@
+(function(){
+
+if (!fixmystreet.maps) {
+    return;
+}
+
+var defaults = {
+    http_options: {
+        url: "https://tilma.mysociety.org/mapserver/bexley",
+        params: {
+            SERVICE: "WFS",
+            VERSION: "1.1.0",
+            REQUEST: "GetFeature",
+            SRSNAME: "urn:ogc:def:crs:EPSG::3857"
+        }
+    },
+    format_class: OpenLayers.Format.GML.v3.MultiCurveFix, // Not sure needed any more
+    max_resolution: 4.777314267158508,
+    min_resolution: 0.5971642833948135,
+    geometryName: 'msGeometry',
+    srsName: "EPSG:3857",
+    body: "London Borough of Bexley",
+    strategy_class: OpenLayers.Strategy.FixMyStreet
+};
+
+var streetlight_default = {
+    fillColor: "#FFFF00",
+    fillOpacity: 0.6,
+    strokeColor: "#000000",
+    strokeOpacity: 0.8,
+    strokeWidth: 2,
+    pointRadius: 6
+};
+
+var pin_prefix = fixmystreet.pin_prefix || document.getElementById('js-map-data').getAttribute('data-pin_prefix');
+
+var streetlight_select = {
+    externalGraphic: pin_prefix + "pin-spot.png",
+    fillColor: "#55BB00",
+    graphicWidth: 48,
+    graphicHeight: 64,
+    graphicXOffset: -24,
+    graphicYOffset: -56,
+    backgroundGraphic: pin_prefix + "pin-shadow.png",
+    backgroundWidth: 60,
+    backgroundHeight: 30,
+    backgroundXOffset: -7,
+    backgroundYOffset: -22,
+    popupYOffset: -40,
+    graphicOpacity: 1.0,
+
+    label: "${Unit_No}",
+    labelOutlineColor: "white",
+    labelOutlineWidth: 3,
+    labelYOffset: 65,
+    fontSize: '15px',
+    fontWeight: 'bold'
+};
+
+var streetlight_stylemap = new OpenLayers.StyleMap({
+  'default': new OpenLayers.Style(streetlight_default),
+  'select': new OpenLayers.Style(streetlight_select)
+});
+
+var labeled_defaults = $.extend(true, {}, defaults, {
+    select_action: true,
+    stylemap: streetlight_stylemap,
+    feature_code: 'Unit_No',
+    asset_type: 'spot',
+    asset_id_field: 'Unit_ID',
+    attributes: {
+        UnitID: 'Unit_ID'
+    },
+    actions: {
+        asset_found: function(asset) {
+          var id = asset.attributes[this.fixmystreet.feature_code] || '';
+          if (id !== '') {
+              var asset_name = this.fixmystreet.asset_item;
+              $('.category_meta_message').html('You have selected ' + asset_name + ' <b>' + id + '</b>');
+          } else {
+              $('.category_meta_message').html(this.fixmystreet.asset_item_message);
+          }
+        },
+        asset_not_found: function() {
+           $('.category_meta_message').html(this.fixmystreet.asset_item_message);
+        }
+    }
+});
+
+fixmystreet.assets.add(defaults, {
+    http_options: {
+        params: {
+            TYPENAME: "Streets",
+        }
+    },
+    always_visible: true,
+    non_interactive: true,
+    nearest_radius: 20,
+    usrn: {
+        attribute: 'NSG_REF',
+        field: 'NSGRef'
+    },
+    stylemap: new OpenLayers.StyleMap({
+        'default': new OpenLayers.Style({
+            fill: false,
+            stroke: false
+        })
+    })
+});
+
+fixmystreet.assets.add(labeled_defaults, {
+    http_options: {
+        params: {
+            TYPENAME: "Bollards"
+        }
+    },
+    asset_category: ["Traffic bollard"],
+    asset_item_message: 'Select the <b class="asset-spot"></b> on the map to pinpoint the exact location of a damaged traffic bollard.',
+    asset_item: 'bollard'
+});
+
+fixmystreet.assets.add(labeled_defaults, {
+    http_options: {
+        params: {
+            TYPENAME: "Lighting"
+        }
+    },
+    asset_category: ["Lamp post", "Light in park or open space", "Underpass light", "Light in multi-storey car park", "Light in outside car park"],
+    asset_item_message: 'Please pinpoint the exact location for the street lighting fault.',
+    asset_item: 'street light'
+});
+
+// We need to trigger the below function on subcategory change also
+$(function(){
+    $("#problem_form").on("change.category", "#form_DALocation", function() {
+        $(fixmystreet).trigger('report_new:category_change', [ $('#form_category') ]);
+    });
+});
+
+fixmystreet.message_controller.register_category({
+    body: defaults.body,
+    category: function() {
+        var cat = $('#form_category').val();
+        if (cat === 'Dead animal') {
+            var where = $('#form_DALocation').val();
+            if (where === 'Garden' || where === 'Other private property') {
+                return true;
+            }
+        }
+        return false;
+    },
+    keep_category_extras: true,
+    message: 'Please follow the link below to pay to remove a dead animal from a private property.'
+});
+
+})();
+
diff --git a/web/cobrands/bexley/layout.scss b/web/cobrands/bexley/layout.scss
new file mode 100644
index 000000000..948b01443
--- /dev/null
+++ b/web/cobrands/bexley/layout.scss
@@ -0,0 +1,33 @@
+@import "_colours";
+
+@import "../sass/layout";
+
+body.twothirdswidthpage .content .sticky-sidebar aside {
+    top: 10em;
+}
+
+#site-logo {
+    width: 208px;
+    height: 80px;
+    padding: 24px 0;
+    background-position: 8px 50%;
+    background-size: 200px 80px;
+}
+
+#front_stats big {
+    color: $fuchsia_lt;
+}
+
+.nav-menu--main {
+  span {
+    background-color: $nav_hover_background_colour;
+  }
+}
+
+.general-notes {
+    font-size: 0.89em;
+}
+
+#key-tools a,button {
+    font-size: 0.89em;
+}
diff --git a/web/cobrands/bristol/assets.js b/web/cobrands/bristol/assets.js
index 77124ce96..b31f3c154 100644
--- a/web/cobrands/bristol/assets.js
+++ b/web/cobrands/bristol/assets.js
@@ -30,26 +30,26 @@ var options = $.extend({}, common_options, {
     }
 });
 
-fixmystreet.assets.add($.extend({}, options, {
+fixmystreet.assets.add(options, {
     wfs_feature: "COD_ASSETS_AREA",
     asset_type: 'area',
     asset_category: "Bridges/Subways",
     asset_item: 'bridge/subway'
-}));
+});
 
-fixmystreet.assets.add($.extend({}, options, {
+fixmystreet.assets.add(options, {
     asset_category: "Gully/Drainage",
     asset_item: 'gully',
     filter_key: 'COD_ASSET_TYPE',
     filter_value: 'GULLY'
-}));
+});
 
-fixmystreet.assets.add($.extend({}, options, {
+fixmystreet.assets.add(options, {
     asset_category: "Grit Bins",
     asset_item: 'grit bin',
     filter_key: 'COD_ASSET_TYPE',
     filter_value: 'GRITBIN'
-}));
+});
 
 
 var lighting_options = $.extend({}, common_options, {
@@ -75,7 +75,7 @@ var lighting_options = $.extend({}, common_options, {
     filter_key: 'Unit_type_description'
 });
 
-fixmystreet.assets.add($.extend({}, lighting_options, {
+fixmystreet.assets.add(lighting_options, {
     asset_category: "Street Light",
     asset_item: 'street light',
     filter_value: [
@@ -88,32 +88,32 @@ fixmystreet.assets.add($.extend({}, lighting_options, {
         'SL: Refuge Column',
         'SL: Subway'
     ]
-}));
+});
 
-fixmystreet.assets.add($.extend({}, lighting_options, {
+fixmystreet.assets.add(lighting_options, {
     asset_category: "Zebra Crossing Light",
     asset_item: 'light',
     filter_value: 'SL: Zebra'
-}));
+});
 
-fixmystreet.assets.add($.extend({}, lighting_options, {
+fixmystreet.assets.add(lighting_options, {
     asset_category: "Iluminated Bollard",
     asset_item: 'bollard',
     filter_value: 'SL: Bollard'
-}));
+});
 
 // NB there's a typo in BCC's ‘Iluminated Bollard’ category so this repeats
 // the above (without the typo) just in case they fix it.
-fixmystreet.assets.add($.extend({}, lighting_options, {
+fixmystreet.assets.add(lighting_options, {
     asset_category: "Illuminated Bollard",
     asset_item: 'bollard',
     filter_value: 'SL: Bollard'
-}));
+});
 
-fixmystreet.assets.add($.extend({}, lighting_options, {
+fixmystreet.assets.add(lighting_options, {
     asset_category: "Illuminated Sign",
     asset_item: 'sign',
     filter_value: 'SL: Sign'
-}));
+});
 
 })();
diff --git a/web/cobrands/bromley/assets.js b/web/cobrands/bromley/assets.js
index 44bf50a98..d5386d9af 100644
--- a/web/cobrands/bromley/assets.js
+++ b/web/cobrands/bromley/assets.js
@@ -37,7 +37,7 @@ OpenLayers.Layer.VectorAssetBromley = OpenLayers.Class(OpenLayers.Layer.VectorAs
     CLASS_NAME: 'OpenLayers.Layer.VectorAssetBromley'
 });
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     class: OpenLayers.Layer.VectorAssetBromley,
     http_options: {
         params: {
@@ -51,9 +51,9 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
     asset_category: ["Street Lighting and Road Signs"],
     subcategories: [ 'SL_LAMP', 'SL_NOT_WORK', 'SL_ON_DAY', 'SL_BLOCK_VEG' ],
     asset_item: 'street light'
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     class: OpenLayers.Layer.VectorAssetBromley,
     http_options: {
         params: {
@@ -64,9 +64,9 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
     subcategories: ['PG_OFLOW_DOG', 'SC_LIT_BIN'],
     asset_item: 'park bin',
     asset_item_message: 'For our parks, pick a <b class="asset-spot">bin</b> from the map &raquo;'
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "Street_Trees"
@@ -74,7 +74,7 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
     },
     asset_category: ["Public Trees"],
     asset_item: 'tree'
-}));
+});
 
 var highways_stylemap = new OpenLayers.StyleMap({
     'default': new OpenLayers.Style({
@@ -100,7 +100,7 @@ $(function(){
     });
 });
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "TFL_Red_Route"
@@ -129,7 +129,7 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
             fixmystreet.body_overrides.remove_only_send();
         }
     }
-}));
+});
 
 var prow_stylemap = new OpenLayers.StyleMap({
     'default': new OpenLayers.Style({
@@ -141,7 +141,7 @@ var prow_stylemap = new OpenLayers.StyleMap({
     })
 });
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "PROW"
@@ -160,6 +160,6 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
             $('#form_prow_reference').val('');
         }
     }
-}));
+});
 
 })();
diff --git a/web/cobrands/bromley/base.scss b/web/cobrands/bromley/base.scss
index 16ca15e55..9435aa35d 100644
--- a/web/cobrands/bromley/base.scss
+++ b/web/cobrands/bromley/base.scss
@@ -26,32 +26,24 @@
 // can't understand a selector it will invalidate the whole line.
 ::-webkit-input-placeholder {
   color: #999;
-  font: {
-    style:normal;
-    size:0.9375em;
-  }
+  font-style: normal;
+  font-size: 0.9375em;
 }
 :-moz-placeholder {
   color: #999;
-  font: {
-    style:normal;
-    size:0.9375em;
-  }
+  font-style: normal;
+  font-size: 0.9375em;
 }
 :-ms-placeholder {
   color: #999;
-  font: {
-    style:normal;
-    size:0.9375em;
-  }
+  font-style: normal;
+  font-size: 0.9375em;
 }
 //this only gets used when the browser doesn't support @placeholder
 .placeholder {
   color: #999;
-  font: {
-    style:normal;
-    size:0.9375em;
-  }
+  font-style: normal;
+  font-size: 0.9375em;
 }
 
 // Reset body line height on front page
diff --git a/web/cobrands/buckinghamshire/assets.js b/web/cobrands/buckinghamshire/assets.js
index 4ced684fd..208eb26e9 100644
--- a/web/cobrands/buckinghamshire/assets.js
+++ b/web/cobrands/buckinghamshire/assets.js
@@ -32,7 +32,7 @@ var defaults = {
     strategy_class: OpenLayers.Strategy.FixMyStreet
 };
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "Grit_Bins"
@@ -40,7 +40,7 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
     },
     asset_category: ["Salt bin damaged", "Salt bin refill"],
     asset_item: 'grit bin'
-}));
+});
 
 var pin_prefix = fixmystreet.pin_prefix || document.getElementById('js-map-data').getAttribute('data-pin_prefix');
 
@@ -123,7 +123,7 @@ var labeled_defaults = $.extend(true, {}, defaults, {
     }
 });
 
-fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
+fixmystreet.assets.add(labeled_defaults, {
     http_options: {
         params: {
             TYPENAME: "StreetLights_Union"
@@ -135,9 +135,9 @@ fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
         'Street light intermittent',
         'Street light not working' ],
     asset_item: 'street light'
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
+fixmystreet.assets.add(labeled_defaults, {
     http_options: {
         params: {
             TYPENAME: "IlluminatedBollards"
@@ -145,9 +145,9 @@ fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
     },
     asset_category: ["Bollard light not working"],
     asset_item: 'bollard'
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
+fixmystreet.assets.add(labeled_defaults, {
     http_options: {
         params: {
             TYPENAME: "Bollards"
@@ -155,9 +155,9 @@ fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
     },
     asset_category: ["Bollards or railings"],
     asset_item: 'bollard'
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
+fixmystreet.assets.add(labeled_defaults, {
     stylemap: streetlight_stylemap,
     http_options: {
         params: {
@@ -168,9 +168,9 @@ fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
           'Belisha Beacon broken',
         ],
     asset_item: 'belisha beacon'
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
+fixmystreet.assets.add(labeled_defaults, {
     stylemap: streetlight_stylemap,
     http_options: {
         params: {
@@ -181,9 +181,9 @@ fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
           'Belisha Beacon broken',
         ],
     asset_item: 'belisha beacon'
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
+fixmystreet.assets.add(labeled_defaults, {
     stylemap: streetlight_stylemap_alt,
     http_options: {
         params: {
@@ -196,9 +196,9 @@ fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
           'Traffic lights & crossings problems with timings',
         ],
     asset_item: 'crossing'
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
+fixmystreet.assets.add(labeled_defaults, {
     http_options: {
         params: {
             TYPENAME: "Signs_Union"
@@ -209,9 +209,9 @@ fixmystreet.assets.add($.extend(true, {}, labeled_defaults, {
           'Sign problem',
         ],
     asset_item: 'sign'
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "Gullies"
@@ -221,7 +221,7 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
         'Blocked drain'
         ],
     asset_item: 'drain'
-}));
+});
 
 // The "whole street asset" layer indicates who is responsible for maintaining
 // a road via the 'feature_ty' attribute on features.
@@ -301,7 +301,7 @@ $(fixmystreet).on('report_new:highways_change', function() {
 });
 
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "Whole_Street"
@@ -360,7 +360,7 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
     },
     filter_key: 'feature_ty',
     filter_value: types_to_show,
-}));
+});
 
 // As with the road found/not_found above, we want to change the destination
 // depending upon the answer to the extra question shown when on a road
@@ -374,7 +374,7 @@ $("#problem_form").on("change", "#form_road-placement", function() {
     }
 });
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "WinterRoutes"
@@ -407,7 +407,7 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
             $("#category_meta .js-gritting-notice").hide();
         }
     }
-}));
+});
 
 fixmystreet.message_controller.register_category({
     body: defaults.body,
diff --git a/web/cobrands/buckinghamshire/js.js b/web/cobrands/buckinghamshire/js.js
index a5d4969d9..6be03f91f 100644
--- a/web/cobrands/buckinghamshire/js.js
+++ b/web/cobrands/buckinghamshire/js.js
@@ -6,13 +6,13 @@ if (!fixmystreet.maps) {
 
 var org_id = '1016';
 var body = "Buckinghamshire County Council";
-fixmystreet.assets.add($.extend(true, {}, fixmystreet.roadworks.layer_future, {
+fixmystreet.assets.add(fixmystreet.roadworks.layer_future, {
     http_options: { params: { organisation_id: org_id } },
     body: body
-}));
-fixmystreet.assets.add($.extend(true, {}, fixmystreet.roadworks.layer_planned, {
+});
+fixmystreet.assets.add(fixmystreet.roadworks.layer_planned, {
     http_options: { params: { organisation_id: org_id } },
     body: body
-}));
+});
 
 })();
diff --git a/web/cobrands/fixmystreet/assets.js b/web/cobrands/fixmystreet/assets.js
index ad14b9390..1d2bc3206 100644
--- a/web/cobrands/fixmystreet/assets.js
+++ b/web/cobrands/fixmystreet/assets.js
@@ -513,7 +513,9 @@ fixmystreet.assets = {
         return selected_feature;
     },
 
-    add: function(options) {
+    add: function(default_options, options) {
+        options = $.extend(true, {}, default_options, options);
+
         var asset_fault_layer = null;
 
         // An interactive layer for selecting an asset (e.g. street light)
@@ -934,11 +936,16 @@ fixmystreet.message_controller = (function() {
     // This shows the reporting form
     function enable_report_form() {
         $(".js-hide-if-invalid-category").show();
+        $(".js-hide-if-invalid-category_extras").show();
     }
 
     // This hides the reporting form, apart from the category selection
-    function disable_report_form() {
+    // And perhaps the category_extras unless asked not to
+    function disable_report_form(keep_category_extras) {
         $(".js-hide-if-invalid-category").hide();
+        if (!keep_category_extras) {
+            $(".js-hide-if-invalid-category_extras").hide();
+        }
     }
 
     // This hides the responsibility message, and (unless a
@@ -1014,17 +1021,19 @@ fixmystreet.message_controller = (function() {
         var $msg;
         if (typeof stopper.message === 'function') {
             $msg = stopper.message();
-            $msg.attr('id', stopperId);
         } else {
-            $msg = $('<p id="' + stopperId + '" class="box-warning">' + stopper.message + '</p>');
+            $msg = $('<p class="box-warning">' + stopper.message + '</p>');
         }
+        $msg.attr('id', stopperId);
+        $msg.attr('role', 'alert');
+        $msg.attr('aria-live', 'assertive');
 
         if ($id.length) {
             $id.replaceWith($msg);
         } else {
             $msg.insertBefore('#js-post-category-messages');
         }
-        disable_report_form();
+        disable_report_form(stopper.keep_category_extras);
     });
 
     return {
diff --git a/web/cobrands/highways/assets.js b/web/cobrands/highways/assets.js
index 5f361e491..8f4734131 100644
--- a/web/cobrands/highways/assets.js
+++ b/web/cobrands/highways/assets.js
@@ -31,7 +31,7 @@ var highways_stylemap = new OpenLayers.StyleMap({
     })
 });
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "Highways"
@@ -72,7 +72,7 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
             $('#highways').remove();
         }
     }
-}));
+});
 
 function add_highways_warning(road_name) {
   var $warning = $('<div class="box-warning" id="highways"><p>It looks like you clicked on the <strong>' + road_name + '</strong> which is managed by <strong>Highways England</strong>. ' +
diff --git a/web/cobrands/lincolnshire/assets.js b/web/cobrands/lincolnshire/assets.js
index f4b1861a9..b36b04b64 100644
--- a/web/cobrands/lincolnshire/assets.js
+++ b/web/cobrands/lincolnshire/assets.js
@@ -29,7 +29,7 @@ var defaults = {
     body: "Lincolnshire County Council"
 };
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "SL_Bollards"
@@ -37,9 +37,9 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
     },
     asset_category: "Bollards (lit)",
     asset_item: 'bollard'
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "SL_Street_Light_Units"
@@ -51,9 +51,9 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
     filter_value: [
         "SL: Bulkhead Lighting", "SL: Refuge Beacon", "SL: Street Lighting Unit"
     ]
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "SL_Street_Light_Units"
@@ -63,7 +63,7 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
     asset_item: 'light',
     filter_key: 'Type',
     filter_value: "SL: Subway Lighting Unit"
-}));
+});
 
 function get_barrier_stylemap() {
     return new OpenLayers.StyleMap({
@@ -86,7 +86,7 @@ function get_barrier_stylemap() {
     });
 }
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "Safety_Barriers"
@@ -98,9 +98,9 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
     filter_value: "ST: Safety Barrier",
     stylemap: get_barrier_stylemap(),
     max_resolution: 1.194328566789627
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "LCC_Drainage-GulliesOffletsManholes"
@@ -108,9 +108,9 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
     },
     asset_category: "Blocked drain",
     asset_item: 'drain'
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "ST_All_Structures"
@@ -122,9 +122,9 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
     filter_value: [
         "ST: Culvert 1 Cell", "ST: Culvert 2+ Cells", "ST: Culvert/Pipe"
     ]
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "SL_Lit_Signs"
@@ -132,9 +132,9 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
     },
     asset_category: "Sign (lit)",
     asset_item: 'street sign'
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "ST_All_Structures"
@@ -151,9 +151,9 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
         "ST: Bridge Ped/Cycle 2+ Spans", "ST: Bridge Vehicular 1 Span",
         "ST: Bridge Vehicular 2-3 Spans", "ST: Bridge Vehicular 4+ Spans"
     ]
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "Carriageway"
@@ -179,9 +179,9 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
             stroke: false
         })
     })
-}));
+});
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "NSG"
@@ -200,7 +200,7 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
         })
     })
 
-}));
+});
 
 var llpg_stylemap = new OpenLayers.StyleMap({
     'default': new OpenLayers.Style({
@@ -218,7 +218,7 @@ var llpg_stylemap = new OpenLayers.StyleMap({
     })
 });
 
-fixmystreet.assets.add($.extend(true, {}, defaults, {
+fixmystreet.assets.add(defaults, {
     http_options: {
         params: {
             TYPENAME: "LLPG"
@@ -229,6 +229,6 @@ fixmystreet.assets.add($.extend(true, {}, defaults, {
     stylemap: llpg_stylemap,
     non_interactive: true,
     always_visible: true
-}));
+});
 
 })();
diff --git a/web/cobrands/lincolnshire/roadworks.js b/web/cobrands/lincolnshire/roadworks.js
index 760e8f00e..0e8923607 100644
--- a/web/cobrands/lincolnshire/roadworks.js
+++ b/web/cobrands/lincolnshire/roadworks.js
@@ -4,10 +4,10 @@ if (!fixmystreet.maps) {
     return;
 }
 
-fixmystreet.assets.add($.extend(true, {}, fixmystreet.roadworks.layer_future, {
+fixmystreet.assets.add(fixmystreet.roadworks.layer_future, {
     http_options: { params: { organisation_id: '1070' } },
     body: "Lincolnshire County Council"
-}));
+});
 // NB Lincs don't want forward planning works displayed, so
 // fixmystreet.roadworks.layer_planned is deliberately missing here.
 
diff --git a/web/cobrands/northamptonshire/assets.js b/web/cobrands/northamptonshire/assets.js
index c6632de5c..cae4c26a5 100644
--- a/web/cobrands/northamptonshire/assets.js
+++ b/web/cobrands/northamptonshire/assets.js
@@ -385,7 +385,7 @@ var northants_defaults = $.extend(true, {}, fixmystreet.assets.alloy_defaults, {
 
 $.each(layers, function(index, layer) {
     if ( layer.categories ) {
-        fixmystreet.assets.add($.extend(true, {}, northants_defaults, {
+        fixmystreet.assets.add(northants_defaults, {
             http_options: {
               layerid: layer.layer,
               layerVersion: layer.version,
@@ -393,7 +393,7 @@ $.each(layers, function(index, layer) {
             asset_type: layer.asset_type || 'spot',
             asset_category: layer.categories,
             asset_item: layer.item_name || layer.layer_name.toLowerCase(),
-        }));
+        });
     }
 });
 
@@ -422,7 +422,7 @@ var northants_road_defaults = $.extend(true, {}, fixmystreet.assets.alloy_defaul
 });
 
 
-fixmystreet.assets.add($.extend(true, {}, northants_road_defaults, {
+fixmystreet.assets.add(northants_road_defaults, {
     http_options: {
       layerid: 221,
       layerVersion: '221.4-',
@@ -433,7 +433,7 @@ fixmystreet.assets.add($.extend(true, {}, northants_road_defaults, {
     asset_category: [
         "Damaged Speed Humps",
     ]
-}));
+});
 
 var barrier_style = new OpenLayers.Style({
     fill: false,
@@ -442,7 +442,7 @@ var barrier_style = new OpenLayers.Style({
     strokeWidth: 4
 });
 
-fixmystreet.assets.add($.extend(true, {}, northants_road_defaults, {
+fixmystreet.assets.add(northants_road_defaults, {
     http_options: {
       layerid: is_live ? 1068 : 230,
       layerVersion: is_live ? '1068.1-' : '230.4-',
@@ -456,7 +456,7 @@ fixmystreet.assets.add($.extend(true, {}, northants_road_defaults, {
     asset_category: [
         "Pedestrian Barriers - Damaged / Missing",
     ]
-}));
+});
 
 var highways_style = new OpenLayers.Style({
     fill: false,
@@ -465,7 +465,7 @@ var highways_style = new OpenLayers.Style({
     strokeWidth: 7
 });
 
-fixmystreet.assets.add($.extend(true, {}, northants_road_defaults, {
+fixmystreet.assets.add(northants_road_defaults, {
     protocol_class: OpenLayers.Protocol.Alloy,
     http_options: {
       layerid: is_live ? 20 : 308,
@@ -503,7 +503,7 @@ fixmystreet.assets.add($.extend(true, {}, northants_road_defaults, {
         "Restricted Visibility / Overgrown / Overhanging",
         "Restricted Visibility",
     ]
-}));
+});
 
 
 var prow_style = new OpenLayers.Style({
@@ -513,7 +513,7 @@ var prow_style = new OpenLayers.Style({
     strokeWidth: 7
 });
 
-fixmystreet.assets.add($.extend(true, {}, northants_road_defaults, {
+fixmystreet.assets.add(northants_road_defaults, {
     http_options: {
       layerid: 173,
       layerVersion: '173.1-',
@@ -527,7 +527,7 @@ fixmystreet.assets.add($.extend(true, {}, northants_road_defaults, {
       "Livestock",
       "Passage-Obstructed/Overgrown"
     ]
-}));
+});
 
 fixmystreet.message_controller.register_category({
     body: northants_defaults.body,
diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss
index 5a1cf8fe7..e193553be 100644
--- a/web/cobrands/sass/_base.scss
+++ b/web/cobrands/sass/_base.scss
@@ -127,11 +127,9 @@ ol.big-numbers {
       top:-0.2em;
       color:$col_big_numbers;
       line-height:1;
-      font: {
-        family: $meta-font;
-        weight:bold;
-        size:2.5rem;
-      }
+      font-family: $meta-font;
+      font-weight: bold;
+      font-size: 2.5rem;
     }
   }
 }
@@ -1838,10 +1836,8 @@ html.js #map .noscript {
   padding:0.75em 30px;
   a {
     @include button-reset(#333, #1a1a1a, #1a1a1a, #fff, #333, #1a1a1a, #1a1a1a, #fff);
-    font: {
-      weight:normal;
-      size:0.875em;
-    }
+    font-weight: normal;
+    font-size: 0.875em;
     line-height:1;
     padding:0.5em 0.75em;
     position:absolute;
@@ -2208,11 +2204,9 @@ label .muted {
   text-align:center;
   margin: 1em;
   h2 {
-    font: {
-      style:italic;
-      family: $meta-font;
-      size:1.1875em;
-    }
+    font-style: italic;
+    font-family: $meta-font;
+    font-size: 1.1875em;
     color:#4d4d4d;
   }
   p {
@@ -2267,10 +2261,8 @@ label .muted {
     background:#1a1a1a;
     color:#C8C8C8;
     padding:0.5em;
-    font: {
-      family: $meta-font;
-      size:0.8125em;
-    }
+    font-family: $meta-font;
+    font-size: 0.8125em;
     @include border-radius(0 0 0.25em 0.25em);
     &:hover {
       text-decoration:none;
@@ -2303,10 +2295,8 @@ a#geolocate_link.loading, .btn--geolocate.loading {
     text-align:center;
     padding:1em;
     line-height:1.25em;
-    font: {
-      size:0.8125em;
-      weight:bold;
-    }
+    font-size: 0.8125em;
+    font-weight: bold;
   }
   big {
     display:block;