diff --git a/server/models/views/station.js b/server/models/views/station.js index 59113f2f3..575e23a5e 100644 --- a/server/models/views/station.js +++ b/server/models/views/station.js @@ -255,10 +255,13 @@ class ViewModel { if (this.station.type === 'g') { this.pageTitle = `Groundwater level at ${stationLocation}` + this.postTitle = `Latest groundwater level information for ${this.station.name} borehole` } else if (this.station.type === 'c') { this.pageTitle = `Sea level at ${stationLocation}` + this.postTitle = `Latest tidal level information for the ${this.station.river} at ${this.station.name}` } else { this.pageTitle = `${this.station.river} level ${this.station.isMulti ? this.station.direction + ' ' : ''}at ${stationLocation}` + this.postTitle = `Latest river level information for the ${this.station.river} at ${this.station.name} ${this.station.isMulti ? this.station.direction : ''}` } this.metaDescription = `Check the latest recorded ${stationType.toLowerCase()} level${forecast ? ',' : ' and'} recent 5-day trend ${forecast ? ' and 36 hour forecast' : ''} at ${stationLocation}` this.metaKeywords = `${stationType} level, ${this.station.name}${this.station.isRiver ? ', ' + this.station.river : ''}${forecast ? ', forecast level' : ''}, flood risk, flood map, gov.uk` diff --git a/server/src/sass/application.scss b/server/src/sass/application.scss index 8f7c2a3f2..16ab7d08f 100644 --- a/server/src/sass/application.scss +++ b/server/src/sass/application.scss @@ -58,6 +58,7 @@ $govuk-breakpoints: ( @import "components/feedback"; @import "components/top-link"; @import "components/toggle-list-display"; +@import "components/social"; // Utilities @import "utilities/details"; diff --git a/server/src/sass/components/_social.scss b/server/src/sass/components/_social.scss new file mode 100644 index 000000000..3300acbe7 --- /dev/null +++ b/server/src/sass/components/_social.scss @@ -0,0 +1,62 @@ +.defra-social { + list-style: none; + margin: 0px; + padding: 0px; + &__channel { + position:relative; + display: inline-block; + margin-right: 30px; + @include govuk-font($size: 16, $weight: bold); + height: 32px; + padding-left: 40px; + margin-bottom: 10px; + } + &__link { + line-height: 32px; + } + &__link:not(:hover) { + text-decoration: none + } + &__link:before { + content: ''; + position: absolute; + top:0px; + left:0px; + width: 32px; + height: 32px; + background-color: transparent; + background-size: 32px; + background-repeat: no-repeat; + background-position: top left; + } + &__link--email:before { + background-image: svg-url(''); + } + &__link--email:hover:before { + background-image: svg-url(''); + } + &__link--email:focus:before, + &__link--email:active:before { + background-image: svg-url(''); + } + &__link--twitter:before { + background-image: svg-url(''); + } + &__link--twitter:hover:before { + background-image: svg-url(''); + } + &__link--twitter:focus:before, + &__link--twitter:active:before { + background-image: svg-url(''); + } + &__link--facebook:before { + background-image: svg-url(''); + } + &__link--facebook:hover:before { + background-image: svg-url(''); + } + &__link--facebook:focus:before, + &__link--facebook:active:before { + background-image: svg-url(''); + } +} diff --git a/server/views/partials/social.html b/server/views/partials/social.html index 187b3f366..4f25ad42e 100644 --- a/server/views/partials/social.html +++ b/server/views/partials/social.html @@ -1,16 +1,16 @@ - diff --git a/server/views/station.html b/server/views/station.html index 7f75059e0..94caf930a 100644 --- a/server/views/station.html +++ b/server/views/station.html @@ -292,6 +292,7 @@
How we measure river, sea and groundwater levels
+ {% include "partials/social.html" %} diff --git a/server/views/target-area.html b/server/views/target-area.html index aba83182e..15890c2a2 100644 --- a/server/views/target-area.html +++ b/server/views/target-area.html @@ -78,8 +78,8 @@Find a river, sea or groundwater level in this area.
Get flood warnings by phone, text or email.
- {% include "partials/context-footer.html" %} - + {% include "partials/context-footer.html" %} + {% include "partials/social.html" %}