diff --git a/package-lock.json b/package-lock.json index 0c0ed17f3..edf51e5cd 100644 --- a/package-lock.json +++ b/package-lock.json @@ -5,7 +5,6 @@ "requires": true, "packages": { "": { - "name": "flood-app", "version": "6.7.4", "hasInstallScript": true, "license": "ISC", diff --git a/server/src/js/components/map/live.js b/server/src/js/components/map/live.js index c4946a123..844cab0e0 100644 --- a/server/src/js/components/map/live.js +++ b/server/src/js/components/map/live.js @@ -697,7 +697,7 @@ maps.createLiveMap = (mapId, options = {}) => { button.setAttribute('data-module', 'govuk-button') } button.id = mapId + '-btn' - button.innerHTML = `${options.btnText || 'View map'}(Visual only)` + button.innerHTML = `${options.btnText || 'View map'}(Visual only)` button.className = options.btnClasses || (options.btnType === 'link' ? 'defra-link-icon-s' : 'defra-button-secondary defra-button-secondary--icon') if (options.data && options.data.button) { button.setAttribute('data-journey-click', options.data.button) diff --git a/server/src/sass/components/_navbar.scss b/server/src/sass/components/_navbar.scss index a8482b672..9d097f82b 100644 --- a/server/src/sass/components/_navbar.scss +++ b/server/src/sass/components/_navbar.scss @@ -10,6 +10,7 @@ display: flex; flex-wrap: nowrap; overflow-x: auto; + overflow-y: hidden; -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; -webkit-overflow-scrolling: touch; @@ -28,17 +29,13 @@ &__inner { flex: 0 0 auto; padding: 3px 15px 4px 15px; - // @include mq ($from: tablet) { - // padding-left: 0px; - // padding-right: 0px; - // } } &__group { float: left; } &__list { list-style: none; - margin: 0px 0px -1px; + margin: 0px; padding: 0px; } &__list:after { @@ -70,6 +67,12 @@ border: 0px; box-shadow: 0 4px 0 govuk-colour('black'); outline: 3px solid transparent; + outline-offset: 0px; + } + a:not([keyboard-focus]):focus { + background-color: white; + box-shadow: none; + text-decoration: underline; } // Overides .defra-link-icon-s { @@ -81,7 +84,6 @@ margin-right: 10px; &:not([keyboard-focus]):focus { background-color: white; - // border-color: govuk-colour('mid-grey'); border: 0px; color: govuk-colour('black'); box-shadow: none; @@ -89,13 +91,6 @@ } &:hover { color: govuk-colour('black'); - background-color: transparent; - svg { - color: currentColor; - } - } - &:active { - color: govuk-colour('black'); } } // Modifiers @@ -139,9 +134,9 @@ float: left; border: 0px; color: $govuk-link-colour; - margin: 0px 7.5px 4px 0px; - padding-top: 7.5px; - padding-bottom: 7.5px; + margin: 0px 7px 3px 0px; + padding-top: 7px; + padding-bottom: 7px; text-decoration: none; &:visited { color: $govuk-link-colour; @@ -159,6 +154,7 @@ color: $govuk-link-colour; box-shadow: none; border: 0px; + text-decoration: none; } &:after { content: 'Map'; @@ -166,19 +162,23 @@ svg { position: relative; display: inline-block; + color: currentColor; vertical-align: top; left: 0px; margin: 0px 7px -3px 1px; top: -1px; } - span { + .defra-button-secondary__icon { + color: govuk-colour('black'); + } + .defra-button-secondary__text { @include defra-visually-hidden(); } } .defra-navbar__item a { color: $govuk-link-colour; text-decoration: none; - padding: 7.5px; + padding: 7px 6px; } .defra-navbar__item a:visited { color: $govuk-link-colour; @@ -187,21 +187,35 @@ color: $govuk-link-hover-colour; svg { color: $govuk-link-hover-colour; - @include high-contrast-mode-only { - color: currentColor; - } + } + } + .defra-navbar__item--selected a{ + background-color: transparent; + color: $govuk-link-colour; + &:after { + content: ''; + position: absolute; + bottom: -4px; + left: 0px; + right: 0px; + border-bottom: 4px solid currentColor; } } .defra-navbar__item a:focus { color: govuk-colour('black'); + background-color: $govuk-focus-colour; + text-decoration: none; + box-shadow: 0 4px 0 govuk-colour('black'); + outline: 3px solid transparent; + outline-offset: 0px; svg { - color: currentColor; + color: govuk-colour('black'); } } - .defra-navbar__item--selected a:not(:focus) { - background-color: transparent; - border-bottom: 4px solid currentColor; + .defra-navbar__item a:not([keyboard-focus]):focus { + background-color: white; color: $govuk-link-colour; - } + box-shadow: none; + } } } diff --git a/server/views/rainfall-station.html b/server/views/rainfall-station.html index dc338bec8..5b6780950 100644 --- a/server/views/rainfall-station.html +++ b/server/views/rainfall-station.html @@ -49,14 +49,22 @@

This measuring s
-
+
diff --git a/server/views/river-and-sea-levels.html b/server/views/river-and-sea-levels.html index 858c48c35..e0e1fba10 100644 --- a/server/views/river-and-sea-levels.html +++ b/server/views/river-and-sea-levels.html @@ -1,126 +1,137 @@ {% extends 'layout.html' %} {% block content %} - + -
-
-

- Find river, sea, groundwater and rainfall levels -

- {% if model.distStatement %}

{{ model.distStatement }}

{% endif %} +
+
+

+ Find river, sea, groundwater and rainfall levels +

+ {% if model.distStatement %} +

{{ model.distStatement }}

+ {% endif %} -
-
- -
- -
- +
+ + +
+ +
+ +
-
- + +
+ {% if not model.stations | length or model.isMultilpleMatch %} + + {% endif %}
- {% if not model.stations | length or model.isMultilpleMatch %} - - {% endif %}
-
-{% if model.q and not model.stations | length and model.q and not model.rivers | length or model.isEngland === false and not model.rivers %} -
-
-

- No results for '{{ model.q }}', England -

-

If you searched for a river or place in England, you should:

-
    -
  • check the spelling
    • -
  • enter a broader location
    • -
-

If you want to search for a place outside England, you should go to:

- -
-
-{% else %} - {% if model.stations | length %} + {% if model.q and not model.stations | length and model.q and not model.rivers | length or model.isEngland === false and not model.rivers %}
-
-
- -
- +

+ No results for '{{ model.q }}', England +

+

If you searched for a river or place in England, you should:

+
    +
  • check the spelling
    • +
  • enter a broader location
    • +
+

If you want to search for a place outside England, you should go to:

+ +
+
+ {% else %} + {% if model.stations | length %} +
+
+
+
-
-
-
- - - - {%- set hideHeader -%} - {% if model.queryGroup == 'rainfall' %}style="display:none"{% endif %} - {%- endset -%} - {%- set hideRainfallHeader -%} - {% if model.queryGroup != 'rainfall' %}style="display:none"{% endif %} - {%- endset -%} - - - - - - - - - - - - - - - {% for item in model.stations %} - {% include "partials/level-row.html" %} - {% endfor %} - -
- Results for {{ model.q }}, showing {{ model.queryGroup }} levels -
Measuring station1 hour6 hours24 hours
Measuring stationHeightTrendState
+
+
+ + + + {%- set hideHeader -%} + {% if model.queryGroup == 'rainfall' %}style="display:none"{% endif %} + {%- endset -%} + {%- set hideRainfallHeader -%} + {% if model.queryGroup != 'rainfall' %}style="display:none"{% endif %} + {%- endset -%} + + + + + + + + + + + + + + + {% for item in model.stations %} + {% include "partials/level-row.html" %} + {% endfor %} + +
+ Results for + {{ model.q }}, showing + {{ model.queryGroup }} + levels +
Measuring station1 hour6 hours24 hours
Measuring stationHeightTrendState
+
-
+ {% endif %} {% endif %} -{% endif %} -
-
- {% include "partials/context-footer.html" %} - {% include "partials/related-content.html" %} +
+
+ {% include "partials/context-footer.html" %} + {% include "partials/related-content.html" %} +
-
- {% endblock %} {% block bodyEnd %} -{{ super() }} - - - + {{ super() }} + + + {% endblock %} diff --git a/server/views/station.html b/server/views/station.html index 3d59f6b2d..8139375ee 100644 --- a/server/views/station.html +++ b/server/views/station.html @@ -26,7 +26,7 @@
-

+

{% if model.station.isGroundwater %}Groundwater{% elif model.station.isCoastal %}Sea{% else %} {{ model.station.river }} {% endif %} level {% if model.station.isMulti %} {% if model.station.isDownstream %}downstream{% else %}upstream{% endif %}{% endif %} at {{ model.station.name }}

@@ -35,11 +35,27 @@

-
@@ -49,9 +65,9 @@

{% if model.station.isDownstream %} -

This measuring station takes 2 measurements. You're viewing the downstream level. View the upstream level.

+

This measuring station takes 2 measurements. You're viewing the downstream level. View the upstream level.

{% else %} -

This measuring station takes 2 measurements. You're viewing the upstream level. View the downstream level.

+

This measuring station takes 2 measurements. You're viewing the upstream level. View the downstream level.

{% endif %}
@@ -265,7 +281,7 @@

How levels here could affect {% endif %} {% for threshold in band.values %} -
+
{{ threshold.description | safe }} {% if threshold.id != 'latest' %} diff --git a/test/routes/station.js b/test/routes/station.js index 17c1bb57a..8a159d7ef 100644 --- a/test/routes/station.js +++ b/test/routes/station.js @@ -407,8 +407,8 @@ lab.experiment('Test - /station/{id}', () => { Code.expect(response.payload).to.contain('Normal') Code.expect(response.payload).to.contain('Steady') Code.expect(response.payload).to.contain('Normal range 0.15m to 3.50m') - Code.expect(response.payload).to.contain('Nearby levels') - Code.expect(response.payload).to.contain('Upstream') + Code.expect(response.payload).to.contain('Nearby levels') + Code.expect(response.payload).to.contain('Upstream') Code.expect(response.payload).to.contain('

Share this page

') Code.expect(response.payload).to.contain('Download data CSV (12KB)') }) @@ -543,8 +543,8 @@ lab.experiment('Test - /station/{id}', () => { Code.expect(response.statusCode).to.equal(200) Code.expect(response.payload).to.contain('River Avon level downstream at Lilbourne - GOV.UK') Code.expect(response.payload).to.contain('This measuring station takes 2 measurements.') - Code.expect(response.payload).to.contain('Nearby levels') - Code.expect(response.payload).to.contain('Downstream') + Code.expect(response.payload).to.contain('Nearby levels') + Code.expect(response.payload).to.contain('Downstream') }) lab.test('GET station/5146 with High river level ', async () => { const floodService = require('../../server/services/flood') @@ -679,8 +679,8 @@ lab.experiment('Test - /station/{id}', () => { Code.expect(response.payload).to.contain('High') Code.expect(response.payload).to.contain('Falling') Code.expect(response.payload).to.contain('Latest at 1:30am') - Code.expect(response.payload).to.contain('Nearby levels') - Code.expect(response.payload).to.contain('Upstream') + Code.expect(response.payload).to.contain('Nearby levels') + Code.expect(response.payload).to.contain('Upstream') Code.expect(response.payload).to.not.contain('Go downstream') }) lab.test('GET Closed station ', async () => { @@ -911,8 +911,8 @@ lab.experiment('Test - /station/{id}', () => { Code.expect(response.payload).to.contain('Low\n') Code.expect(response.payload).to.contain('Rising') Code.expect(response.payload).to.contain('Latest at 1:30am') - Code.expect(response.payload).to.contain('Nearby levels') - Code.expect(response.payload).to.contain('Upstream') + Code.expect(response.payload).to.contain('Nearby levels') + Code.expect(response.payload).to.contain('Upstream') }) lab.test('GET station/3130 Coastal ', async () => { const floodService = require('../../server/services/flood') @@ -1545,9 +1545,9 @@ lab.experiment('Test - /station/{id}', () => { Code.expect(response.statusCode).to.equal(200) Code.expect(response.payload).to.contain('The highest level in the model is') Code.expect(response.payload).to.not.contain('') - Code.expect(response.payload).to.contain('Upstream') - Code.expect(response.payload).to.contain('Downstream') - Code.expect(response.payload).to.contain('Nearby levels') + Code.expect(response.payload).to.contain('Upstream') + Code.expect(response.payload).to.contain('Downstream') + Code.expect(response.payload).to.contain('Nearby levels') }) lab.test('GET station/5146 with latest value over hour old but < 24 hours ', async () => { const floodService = require('../../server/services/flood') @@ -1839,7 +1839,7 @@ lab.experiment('Test - /station/{id}', () => { Code.expect(response.statusCode).to.equal(302) }) - lab.test('GET station/5146 with status date showing time data interupted', async () => { + lab.test('GET station/5146 with status date showing time data interrupted', async () => { const floodService = require('../../server/services/flood') const dateInterupted = new Date() @@ -1971,8 +1971,8 @@ lab.experiment('Test - /station/{id}', () => { Code.expect(response.statusCode).to.equal(200) Code.expect(response.payload).to.contain('River Ribble level at Walton-Le-Dale - GOV.UK') Code.expect(response.payload).to.contain('This data feed was interrupted') - Code.expect(response.payload).to.contain('Nearby levels') - Code.expect(response.payload).to.contain('Upstream') + Code.expect(response.payload).to.contain('Nearby levels') + Code.expect(response.payload).to.contain('Upstream') Code.expect(response.payload).to.contain('

Share this page

') Code.expect(response.payload).to.contain('Download data CSV (12KB)') }) @@ -2367,8 +2367,8 @@ lab.experiment('Test - /station/{id}', () => { Code.expect(response.payload).to.contain('River Ribble level at Walton-Le-Dale - GOV.UK') Code.expect(response.payload).to.contain('Steady') Code.expect(response.payload).to.not.contain('Normal range ') - Code.expect(response.payload).to.contain('Nearby levels') - Code.expect(response.payload).to.contain('Upstream') + Code.expect(response.payload).to.contain('Nearby levels') + Code.expect(response.payload).to.contain('Upstream') Code.expect(response.payload).to.contain('

Share this page

') Code.expect(response.payload).to.contain('Download data CSV (12KB)') })