diff options
20 files changed, 80 insertions, 34 deletions
diff --git a/CHANGELOG.md b/CHANGELOG.md index 70bd975cf..82c86bffd 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,6 +10,8 @@ - Fix issue with red bars on bar graph of many categories. - Prefetch translations in /reports list of bodies. - Ignore deleted/area-less bodies in dashboard list. + - UK: + - Lazy load images in the footer. * v2.3 (18th December 2017) - New features: diff --git a/templates/web/base/common_header_tags.html b/templates/web/base/common_header_tags.html index 749a4f740..541bb1a56 100644 --- a/templates/web/base/common_header_tags.html +++ b/templates/web/base/common_header_tags.html @@ -14,7 +14,8 @@ <script nonce="[% csp_nonce %]"> window.Modernizr=function(e,t,n){function r(e){p.cssText=e}function o(e,t){return typeof e===t}var a,i,c,l="2.8.3",s={},u=t.documentElement,d="modernizr",f=t.createElement(d),p=f.style,m=({}.toString,{}),h=[],y=h.slice,v=function(e,n,r,o){var a,i,c,l,s=t.createElement("div"),f=t.body,p=f||t.createElement("body");if(parseInt(r,10))for(;r--;)c=t.createElement("div"),c.id=o?o[r]:d+(r+1),s.appendChild(c);return a=["­",'<style id="s',d,'">',e,"</style>"].join(""),s.id=d,(f?s:p).innerHTML+=a,p.appendChild(s),f||(p.style.background="",p.style.overflow="hidden",l=u.style.overflow,u.style.overflow="hidden",u.appendChild(p)),i=n(s,e),f?s.parentNode.removeChild(s):(p.parentNode.removeChild(p),u.style.overflow=l),!!i},g=function(t){var n=e.matchMedia||e.msMatchMedia;if(n)return n(t)&&n(t).matches||!1;var r;return v("@media "+t+" { #"+d+" { position: absolute; } }",function(t){r="absolute"==(e.getComputedStyle?getComputedStyle(t,null):t.currentStyle).position}),r},b={}.hasOwnProperty;c=o(b,"undefined")||o(b.call,"undefined")?function(e,t){return t in e&&o(e.constructor.prototype[t],"undefined")}:function(e,t){return b.call(e,t)};for(var E in m)c(m,E)&&(i=E.toLowerCase(),s[i]=m[E](),h.push((s[i]?"":"no-")+i));return r(""),f=a=null,s._version=l,s.mq=g,s.testStyles=v,s}(this,this.document); var fixmystreet=fixmystreet||{}; - (function(b){var a=b.documentElement;a.className=a.className.replace(/\bno-js\b/,"js");var c=-1<a.className.indexOf("iel8"),c=Modernizr.mq("(min-width: 48em)")||c?"desktop":"mobile";b=b.getElementById("js-meta-data");fixmystreet.page=b.getAttribute("data-page");fixmystreet.cobrand=b.getAttribute("data-cobrand");"mobile"==c&&(a.className+=" mobile","around"==fixmystreet.page&&(a.className+=" map-fullscreen only-map map-reporting"))})(document); + (function(b){var a=b.documentElement;a.className=a.className.replace(/\bno-js\b/,"js");var c=-1<a.className.indexOf("iel8");c=Modernizr.mq("(min-width: 48em)")||c?"desktop":"mobile";b=b.getElementById("js-meta-data");"IntersectionObserver"in window&&(a.className+=" lazyload");fixmystreet.page=b.getAttribute("data-page");fixmystreet.cobrand=b.getAttribute("data-cobrand");"mobile"==c&&(a.className+=" mobile","around"==fixmystreet.page&&(a.className+=" map-fullscreen only-map map-reporting"))})(document); + </script> [% IF robots %] diff --git a/templates/web/fixmystreet.com/footer_extra.html b/templates/web/fixmystreet.com/footer_extra.html index 819943f67..6edf23b9f 100644 --- a/templates/web/fixmystreet.com/footer_extra.html +++ b/templates/web/fixmystreet.com/footer_extra.html @@ -9,11 +9,11 @@ </div> <div class="fms-app-badges"> - <a href="https://itunes.apple.com/gb/app/fixmystreet/id297456545"> - <img alt="FixMyStreet app on the App Store" src="[% base %]/cobrands/fixmystreet/images/itunes_store_logo.png" srcset="[% base %]/cobrands/fixmystreet/images/itunes_store_logo.png 1x, [% base %]/cobrands/fixmystreet/images/itunes_store_logo@2.png 2x" /> + <a class="js-lazyload fms-app-badge fms-app-badge--ios" href="https://itunes.apple.com/gb/app/fixmystreet/id297456545"> + FixMyStreet app on the App Store </a> - <a href="https://play.google.com/store/apps/details?id=org.mysociety.FixMyStreet"> - <img alt="FixMyStreet Android app on Google Play" src="[% base %]/cobrands/fixmystreet/images/google_play_logo.png" srcset="[% base %]/cobrands/fixmystreet/images/google_play_logo.png 1x, [% base %]/cobrands/fixmystreet/images/google_play_logo@2.png 2x" /> + <a class="js-lazyload fms-app-badge fms-app-badge--android" href="https://play.google.com/store/apps/details?id=org.mysociety.FixMyStreet"> + FixMyStreet Android app on Google Play </a> </div> </div> @@ -59,11 +59,11 @@ <div class="mysoc-footer__orgs"> <p class="mysoc-footer__org"> Built by - <a href="https://www.mysociety.org?utm_source=fixmystreet.com&utm_content=footer+logo&utm_medium=link&utm_campaign=mysoc_footer" class="mysoc-footer__org__logo mysoc-footer__org__logo--mysociety">mySociety</a> + <a href="https://www.mysociety.org?utm_source=fixmystreet.com&utm_content=footer+logo&utm_medium=link&utm_campaign=mysoc_footer" class="js-lazyload mysoc-footer__org__logo mysoc-footer__org__logo--mysociety">mySociety</a> </p> <p class="mysoc-footer__org"> Powered by - <a href="http://fixmystreet.org" class="mysoc-footer__org__logo mysoc-footer__org__logo--fms-platform">FixMyStreet Platform</a> + <a href="http://fixmystreet.org" class="js-lazyload mysoc-footer__org__logo mysoc-footer__org__logo--fms-platform">FixMyStreet Platform</a> </p> </div> </div> @@ -76,9 +76,9 @@ <div class="col-sm-2"> <ul class="mysoc-footer__badges"> - <li role="presentation"><a href="https://github.com/mysociety/fixmystreet" class="mysoc-footer__badge mysoc-footer__badge--github">Github</a></li> - <li role="presentation"><a href="https://twitter.com/fixmystreet/" class="mysoc-footer__badge mysoc-footer__badge--twitter">Twitter</a></li> - <li role="presentation"><a href="https://www.facebook.com/FixMyStreet" class="mysoc-footer__badge mysoc-footer__badge--facebook">Facebook</a></li> + <li role="presentation"><a href="https://github.com/mysociety/fixmystreet" class="js-lazyload mysoc-footer__badge mysoc-footer__badge--github">Github</a></li> + <li role="presentation"><a href="https://twitter.com/fixmystreet/" class="js-lazyload mysoc-footer__badge mysoc-footer__badge--twitter">Twitter</a></li> + <li role="presentation"><a href="https://www.facebook.com/FixMyStreet" class="js-lazyload mysoc-footer__badge mysoc-footer__badge--facebook">Facebook</a></li> </ul> </div> diff --git a/templates/web/fixmystreet.com/footer_extra_js.html b/templates/web/fixmystreet.com/footer_extra_js.html index cb1b78743..0e0300af7 100644 --- a/templates/web/fixmystreet.com/footer_extra_js.html +++ b/templates/web/fixmystreet.com/footer_extra_js.html @@ -1,4 +1,7 @@ [% +scripts.push( + version('/js/lazyload.js'), +); IF bodyclass.match('mappage'); scripts.push( version('/vendor/OpenLayers.Projection.OrdnanceSurvey.js'), diff --git a/web/cobrands/fixamingata/layout.scss b/web/cobrands/fixamingata/layout.scss index 2d82af1ad..bae9cd89b 100644 --- a/web/cobrands/fixamingata/layout.scss +++ b/web/cobrands/fixamingata/layout.scss @@ -67,6 +67,10 @@ h3, h4, @import "_colours"; @import "../sass/layout"; +body.mappage { + background-image: none; +} + #site-header { background: $map_nav_bg; padding: 1em 0; diff --git a/web/cobrands/fixmystreet.com/_mysoc_footer.scss b/web/cobrands/fixmystreet.com/_mysoc_footer.scss index 383ec5716..d2c4af86d 100644 --- a/web/cobrands/fixmystreet.com/_mysoc_footer.scss +++ b/web/cobrands/fixmystreet.com/_mysoc_footer.scss @@ -1,4 +1,4 @@ -// Standard mySociety Footer v1.0.2 +// Standard mySociety Footer v1.0.6 // https://github.com/mysociety/standard-footer $mysoc-footer-background-color: #fff !default; @@ -27,8 +27,6 @@ $mysoc-footer-legal-text-color: #6C6B68 !default; $mysoc-footer-image-path: '../img/mysoc-footer/' !default; $mysoc-footer-breakpoint-sm: 768px !default; -$high-dpi-screen: '-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi' !default; - .mysoc-footer { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; @@ -166,9 +164,6 @@ $high-dpi-screen: '-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi width: 152px; background: transparent url('#{$mysoc-footer-image-path}logo-mysociety.png') 0 0 no-repeat; background-size: 152px 32px; - @media ($high-dpi-screen) { - background-image: url('#{$mysoc-footer-image-path}logo-mysociety@2x.png'); - } background-image: url('#{$mysoc-footer-image-path}logo-mysociety.svg'), none; } @@ -205,26 +200,17 @@ $high-dpi-screen: '-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi .mysoc-footer__badge--github { background: transparent url('#{$mysoc-footer-image-path}icon-github.png') 0 0 no-repeat; background-size: 32px 32px; - @media ($high-dpi-screen) { - background-image: url('#{$mysoc-footer-image-path}icon-github@2x.png'); - } background-image: url('#{$mysoc-footer-image-path}icon-github.svg'), none; } .mysoc-footer__badge--twitter { background: transparent url('#{$mysoc-footer-image-path}icon-twitter.png') 0 0 no-repeat; background-size: 32px 32px; - @media ($high-dpi-screen) { - background-image: url('#{$mysoc-footer-image-path}icon-twitter@2x.png'); - } background-image: url('#{$mysoc-footer-image-path}icon-twitter.svg'), none; } .mysoc-footer__badge--facebook { background: transparent url('#{$mysoc-footer-image-path}icon-facebook.png') 0 0 no-repeat; background-size: 32px 32px; - @media ($high-dpi-screen) { - background-image: url('#{$mysoc-footer-image-path}icon-facebook@2x.png'); - } background-image: url('#{$mysoc-footer-image-path}icon-facebook.svg'), none; } diff --git a/web/cobrands/fixmystreet.com/base.scss b/web/cobrands/fixmystreet.com/base.scss index d8f8f123e..029749ec1 100644 --- a/web/cobrands/fixmystreet.com/base.scss +++ b/web/cobrands/fixmystreet.com/base.scss @@ -199,6 +199,10 @@ $grid-breakpoint-sm: $mysoc-footer-breakpoint-sm; @import "mysoc_footer"; +html.lazyload .js-lazyload { + background-image: none; +} + .mysoc-footer { @media print { @@ -261,15 +265,22 @@ $grid-breakpoint-sm: $mysoc-footer-breakpoint-sm; .fms-app-badges { margin: 1em 0; - - a { - text-decoration: none; - } - - img { - border: none; - margin-right: 0.5em; - } +} +.fms-app-badge { + display: inline-block; + text-decoration: none; + width: 135px; + height: 0; + padding-top: 40px; + background-size: 135px 40px; + overflow: hidden; + margin-right: 0.5em; +} +.fms-app-badge--ios { + @include svg-background-image('/cobrands/fixmystreet/images/itunes_store_logo'); +} +.fms-app-badge--android { + @include svg-background-image('/cobrands/fixmystreet/images/google_play_logo'); } .fms-pro-promo { diff --git a/web/cobrands/fixmystreet.com/images/mysoc-footer/icon-facebook@2x.png b/web/cobrands/fixmystreet.com/images/mysoc-footer/icon-facebook@2x.png Binary files differdeleted file mode 100644 index 137878d77..000000000 --- a/web/cobrands/fixmystreet.com/images/mysoc-footer/icon-facebook@2x.png +++ /dev/null diff --git a/web/cobrands/fixmystreet.com/images/mysoc-footer/icon-github@2x.png b/web/cobrands/fixmystreet.com/images/mysoc-footer/icon-github@2x.png Binary files differdeleted file mode 100644 index e6d0d4124..000000000 --- a/web/cobrands/fixmystreet.com/images/mysoc-footer/icon-github@2x.png +++ /dev/null diff --git a/web/cobrands/fixmystreet.com/images/mysoc-footer/icon-twitter@2x.png b/web/cobrands/fixmystreet.com/images/mysoc-footer/icon-twitter@2x.png Binary files differdeleted file mode 100644 index 1bd1d4bb6..000000000 --- a/web/cobrands/fixmystreet.com/images/mysoc-footer/icon-twitter@2x.png +++ /dev/null diff --git a/web/cobrands/fixmystreet.com/images/mysoc-footer/logo-mysociety@2x.png b/web/cobrands/fixmystreet.com/images/mysoc-footer/logo-mysociety@2x.png Binary files differdeleted file mode 100644 index 600a20fd6..000000000 --- a/web/cobrands/fixmystreet.com/images/mysoc-footer/logo-mysociety@2x.png +++ /dev/null diff --git a/web/cobrands/fixmystreet.com/layout.scss b/web/cobrands/fixmystreet.com/layout.scss index e42dbacf7..0e37c9723 100644 --- a/web/cobrands/fixmystreet.com/layout.scss +++ b/web/cobrands/fixmystreet.com/layout.scss @@ -73,6 +73,9 @@ body { background-size: 500px; } } +body.mappage { + background-image: none; +} // Tiled background stripe, not plain colour #front-main { diff --git a/web/cobrands/fixmystreet/header.js b/web/cobrands/fixmystreet/header.js index e4b0a9a91..103922b08 100644 --- a/web/cobrands/fixmystreet/header.js +++ b/web/cobrands/fixmystreet/header.js @@ -8,6 +8,9 @@ var fixmystreet = fixmystreet || {}; var iel8 = E.className.indexOf('iel8') > -1; var type = Modernizr.mq('(min-width: 48em)') || iel8 ? 'desktop' : 'mobile'; var meta = D.getElementById('js-meta-data'); + if ('IntersectionObserver' in window) { + E.className += ' lazyload'; + } fixmystreet.page = meta.getAttribute('data-page'); fixmystreet.cobrand = meta.getAttribute('data-cobrand'); if (type == 'mobile') { diff --git a/web/cobrands/fixmystreet/images/google_play_logo.png b/web/cobrands/fixmystreet/images/google_play_logo.png Binary files differindex b1e774859..1e0041aeb 100644 --- a/web/cobrands/fixmystreet/images/google_play_logo.png +++ b/web/cobrands/fixmystreet/images/google_play_logo.png diff --git a/web/cobrands/fixmystreet/images/google_play_logo.svg b/web/cobrands/fixmystreet/images/google_play_logo.svg new file mode 100644 index 000000000..46118790c --- /dev/null +++ b/web/cobrands/fixmystreet/images/google_play_logo.svg @@ -0,0 +1 @@ +<svg width="135" height="40" viewBox="0 0 135 40" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient x1="91.5%" y1="4.8%" x2="-37.6%" y2="72%" id="a"><stop stop-color="#00A0FF" offset="0%"/><stop stop-color="#00A1FF" offset=".7%"/><stop stop-color="#00BEFF" offset="26%"/><stop stop-color="#00D2FF" offset="51.2%"/><stop stop-color="#00DFFF" offset="76%"/><stop stop-color="#00E3FF" offset="100%"/></linearGradient><linearGradient x1="107.7%" y1="49.4%" x2="-130.7%" y2="49.4%" id="b"><stop stop-color="#FFE000" offset="0%"/><stop stop-color="#FFBD00" offset="40.9%"/><stop stop-color="#FFA500" offset="77.5%"/><stop stop-color="#FF9C00" offset="100%"/></linearGradient><linearGradient x1="86.4%" y1="17.8%" x2="-49.9%" y2="194.4%" id="c"><stop stop-color="#FF3A44" offset="0%"/><stop stop-color="#C31162" offset="100%"/></linearGradient><linearGradient x1="-18.6%" y1="-54.5%" x2="42.3%" y2="24.7%" id="d"><stop stop-color="#32A071" offset="0%"/><stop stop-color="#2DA771" offset="6.8%"/><stop stop-color="#15CF74" offset="47.6%"/><stop stop-color="#06E775" offset="80.1%"/><stop stop-color="#00F076" offset="100%"/></linearGradient></defs><g fill="none"><path d="M129.5 39.5H5.5c-2.8 0-5-2.1-5-4.9V5.4C.5 2.6 2.7.5 5.5.5h124c2.8 0 5 2.1 5 4.9v29.2a5 5 0 0 1-5 4.9z" fill="#000"/><path d="M130 .8c2.3 0 4.2 1.9 4.2 4.2v30c0 2.3-1.9 4.2-4.2 4.2H5A4.2 4.2 0 0 1 .8 35V5C.8 2.7 2.7.8 5 .8h125zm0-.8H5a5 5 0 0 0-5 5v30a5 5 0 0 0 5 5h125a5 5 0 0 0 5-5V5a5 5 0 0 0-5-5z" fill="#A6A6A6"/><path d="M47.4 10.2c0 .8-.2 1.5-.7 2a3 3 0 0 1-2.2.9 3 3 0 0 1-2.2-.9 3 3 0 0 1-.9-2.2c0-.9.3-1.6.9-2.2a3 3 0 0 1 3.4-.6c.4.2.7.4.9.7l-.5.5c-.4-.5-.9-.7-1.6-.7a2 2 0 0 0-1.6.7c-.5.4-.7 1-.7 1.7s.2 1.3.7 1.7c.5.4 1 .7 1.6.7.7 0 1.2-.2 1.7-.7.3-.3.5-.7.5-1.2h-2.2v-.7h2.9v.3zM52 7.7h-2.7v1.9h2.5v.7h-2.5v1.9H52v.8h-3.5V7H52zm3.3 5.3h-.8V7.7h-1.7V7H57v.7h-1.7zm4.6 0V7h.8v6zm4.2 0h-.8V7.7h-1.7V7h4.1v.7H64V13zm9.5-.8a3 3 0 0 1-2.2.9 3 3 0 0 1-2.2-.9 3 3 0 0 1-.9-2.2c0-.9.3-1.6.9-2.2a3 3 0 0 1 2.2-.9 3 3 0 0 1 2.2.9c.6.6.9 1.3.9 2.2a3 3 0 0 1-.9 2.2zm-3.8-.5c.4.4 1 .7 1.6.7a2 2 0 0 0 1.6-.7c.4-.4.7-1 .7-1.7s-.2-1.3-.7-1.7c-.4-.4-1-.7-1.6-.7a2 2 0 0 0-1.6.7c-.4.4-.7 1-.7 1.7s.2 1.3.7 1.7zm5.8 1.3V7h.9l2.9 4.7V7h.8v6h-.8l-3.1-4.9V13z" fill="#FFF" stroke="#FFF" stroke-width=".2"/><path d="M68.1 21.8a4.2 4.2 0 0 0-4.3 4.3c0 2.4 1.9 4.3 4.3 4.3s4.3-1.8 4.3-4.3c0-2.6-1.9-4.3-4.3-4.3zm0 6.8c-1.3 0-2.4-1.1-2.4-2.6s1.1-2.6 2.4-2.6c1.3 0 2.4 1 2.4 2.6 0 1.5-1.1 2.6-2.4 2.6zm-9.3-6.8a4.2 4.2 0 0 0-4.3 4.3c0 2.4 1.9 4.3 4.3 4.3s4.3-1.8 4.3-4.3c0-2.6-1.9-4.3-4.3-4.3zm0 6.8c-1.3 0-2.4-1.1-2.4-2.6s1.1-2.6 2.4-2.6c1.3 0 2.4 1 2.4 2.6 0 1.5-1.1 2.6-2.4 2.6zm-11.1-5.5v1.8H52c-.1 1-.5 1.8-1 2.3-.6.6-1.6 1.3-3.3 1.3a4.7 4.7 0 0 1-4.7-4.8 4.7 4.7 0 0 1 8-3.5l1.3-1.3a6.4 6.4 0 0 0-4.5-1.8c-3.6 0-6.7 3-6.7 6.6 0 3.6 3.1 6.6 6.7 6.6a6 6 0 0 0 6.2-6.1l-.1-1.1h-6.2zm45.4 1.4c-.4-1-1.4-2.7-3.6-2.7s-4 1.7-4 4.3c0 2.4 1.8 4.3 4.2 4.3 1.9 0 3.1-1.2 3.5-1.9l-1.4-1c-.5.7-1.1 1.2-2.1 1.2s-1.6-.4-2.1-1.3l5.7-2.4-.2-.5zm-5.8 1.4c0-1.6 1.3-2.5 2.2-2.5.7 0 1.4.4 1.6.9l-3.8 1.6zM82.6 30h1.9V17.5h-1.9V30zm-3-7.3c-.5-.5-1.3-1-2.3-1a4.3 4.3 0 0 0-4.1 4.3c0 2.4 1.9 4.2 4.1 4.2 1 0 1.8-.5 2.2-1h.1v.6c0 1.6-.9 2.5-2.3 2.5-1.1 0-1.9-.8-2.1-1.5l-1.6.7a4.1 4.1 0 0 0 3.8 2.5c2.2 0 4-1.3 4-4.4V22h-1.8v.7zm-2.2 5.9c-1.3 0-2.4-1.1-2.4-2.6s1.1-2.6 2.4-2.6c1.3 0 2.3 1.1 2.3 2.6s-1 2.6-2.3 2.6zm24.4-11.1h-4.5V30h1.9v-4.7h2.6c2.1 0 4.1-1.5 4.1-3.9s-2-3.9-4.1-3.9zm.1 6h-2.7v-4.3h2.7c1.4 0 2.2 1.2 2.2 2.1-.1 1.1-.9 2.2-2.2 2.2zm11.5-1.8c-1.4 0-2.8.6-3.3 1.9l1.7.7c.4-.7 1-.9 1.7-.9 1 0 1.9.6 2 1.6v.1a4 4 0 0 0-1.9-.5c-1.8 0-3.6 1-3.6 2.8 0 1.7 1.5 2.8 3.1 2.8 1.3 0 1.9-.6 2.4-1.2h.1v1h1.8v-4.8c-.2-2.2-1.9-3.5-4-3.5zm-.2 6.9c-.6 0-1.5-.3-1.5-1.1 0-1 1.1-1.3 2-1.3.8 0 1.2.2 1.7.4-.2 1.2-1.2 2-2.2 2zm10.5-6.6l-2.1 5.4h-.1l-2.2-5.4h-2l3.3 7.6-1.9 4.2h1.9l5.1-11.8h-2zm-16.8 8h1.9V17.5h-1.9V30z" fill="#FFF"/><path d="M1.4.5a2 2 0 0 0-.5 1.4V24c0 .6.2 1.1.5 1.4l.1.1 12.4-12.4v-.2L1.4.5z" fill="url(#a)" transform="translate(9 7)"/><path d="M18 17.3l-4.1-4.1v-.3L18 8.8l.1.1 4.9 2.8c1.4.8 1.4 2.1 0 2.9l-5 2.7z" fill="url(#b)" transform="translate(9 7)"/><path d="M18.1 17.2L13.9 13 1.4 25.5c.5.5 1.2.5 2.1.1l14.6-8.4" fill="url(#c)" transform="translate(9 7)"/><path d="M18.1 8.8L3.5.5C2.6 0 1.9.1 1.4.6L13.9 13l4.2-4.2z" fill="url(#d)" transform="translate(9 7)"/><g fill="#000"><path d="M27 24.1l-14.5 8.2c-.8.5-1.5.4-2 0l-.1.1.1.1c.5.4 1.2.5 2 0L27 24.1z" opacity=".2"/><path d="M10.4 32.3c-.3-.3-.4-.8-.4-1.4v.1c0 .6.2 1.1.5 1.4v-.1h-.1z" opacity=".1"/></g><path d="M32 21.3l-5 2.8.1.1 4.9-2.8c.7-.4 1-.9 1-1.4 0 .5-.4.9-1 1.3z" fill="#000" opacity=".1"/><path d="M12.5 7.6L32 18.7c.6.4 1 .8 1 1.3 0-.5-.3-1-1-1.4L12.5 7.5C11.1 6.7 10 7.4 10 9v.1c0-1.6 1.1-2.3 2.5-1.5z" fill="#FFF" opacity=".3"/></g></svg>
\ No newline at end of file diff --git a/web/cobrands/fixmystreet/images/google_play_logo@2.png b/web/cobrands/fixmystreet/images/google_play_logo@2.png Binary files differdeleted file mode 100644 index dfeb5a9a4..000000000 --- a/web/cobrands/fixmystreet/images/google_play_logo@2.png +++ /dev/null diff --git a/web/cobrands/fixmystreet/images/itunes_store_logo.png b/web/cobrands/fixmystreet/images/itunes_store_logo.png Binary files differindex b65d5a5a4..b1ecf7515 100644 --- a/web/cobrands/fixmystreet/images/itunes_store_logo.png +++ b/web/cobrands/fixmystreet/images/itunes_store_logo.png diff --git a/web/cobrands/fixmystreet/images/itunes_store_logo.svg b/web/cobrands/fixmystreet/images/itunes_store_logo.svg new file mode 100644 index 000000000..34d0ab910 --- /dev/null +++ b/web/cobrands/fixmystreet/images/itunes_store_logo.svg @@ -0,0 +1 @@ +<svg width="135" height="40" viewBox="0 0 135 40" xmlns="http://www.w3.org/2000/svg"><g fill="none"><path d="M129.5 39.5H5.5c-2.8 0-5-2.1-5-4.9V5.4C.5 2.6 2.7.5 5.5.5h124c2.8 0 5 2.1 5 4.9v29.2a5 5 0 0 1-5 4.9z" fill="#000"/><path d="M130 .8c2.3 0 4.2 1.9 4.2 4.2v30c0 2.3-1.9 4.2-4.2 4.2H5A4.2 4.2 0 0 1 .8 35V5C.8 2.7 2.7.8 5 .8h125zm0-.8H5a5 5 0 0 0-5 5v30a5 5 0 0 0 5 5h125a5 5 0 0 0 5-5V5a5 5 0 0 0-5-5z" fill="#A6A6A6"/><path d="M29.8 20.3a5 5 0 0 1 2.3-4.2 5 5 0 0 0-4-2.1c-1.6-.2-3.3 1-4.1 1-.9 0-2.2-1-3.6-1a5.3 5.3 0 0 0-4.5 2.8c-2 3.3-.5 8.2 1.4 11 .9 1.3 2 2.7 3.4 2.7s1.9-.9 3.6-.9c1.6 0 2.1.9 3.5.9 1.5 0 2.5-1.4 3.4-2.7.6-1 1.1-2 1.5-3.1-1.8-.7-3-2.5-3-4.4zM27 12.2c.8-1 1.2-2.2 1.2-3.5a5 5 0 0 0-3.3 1.7c-.8.9-1.2 2.1-1.1 3.3a4 4 0 0 0 3.2-1.5zM51.3 27.1h-4.7l-1.2 3.4h-2L48 18.1h2l4.6 12.4h-2l-1.2-3.4zm-4.2-1.5h3.7L49 20l-2 5.5zm17.1.4c0 2.8-1.5 4.6-3.8 4.6a3 3 0 0 1-2.9-1.6v4.5h-1.9v-12h1.8v1.4c.7-1 1.8-1.6 3-1.6 2.2 0 3.8 1.9 3.8 4.7zm-2 0c0-1.9-.9-3-2.3-3-1.5 0-2.4 1.2-2.4 3s1 3 2.4 3 2.3-1.2 2.3-3zm11.9 0c0 2.8-1.5 4.6-3.8 4.6a3 3 0 0 1-2.8-1.6v4.5h-1.9v-12h1.8v1.4c.6-1 1.7-1.6 3-1.6 2.2 0 3.7 1.9 3.7 4.7zm-1.9 0c0-1.9-1-3-2.4-3s-2.4 1.2-2.4 3 1 3 2.4 3c1.5 0 2.4-1.2 2.4-3zm8.5 1c.1 1.3 1.3 2 3 2 1.5 0 2.7-.7 2.7-1.8 0-1-.7-1.6-2.3-2l-1.6-.4c-2.3-.5-3.4-1.6-3.4-3.3 0-2.2 1.9-3.6 4.6-3.6 2.6 0 4.4 1.4 4.4 3.6h-1.8c-.2-1.3-1.2-2-2.7-2-1.5 0-2.5.8-2.5 1.9 0 .8.7 1.4 2.3 1.7l1.3.4c2.6.6 3.6 1.6 3.6 3.4 0 2.3-1.8 3.8-4.8 3.8-2.7 0-4.6-1.4-4.7-3.7h2zm11.6-7.7v2.1h1.8V23h-1.8v5c0 .8.4 1.1 1.1 1.1h.7v1.5h-1c-2 0-2.6-.6-2.6-2.4V23h-1.3v-1.5h1.3v-2.1h1.8zM95 26c0-2.9 1.7-4.7 4.4-4.7 2.6 0 4.3 1.8 4.3 4.7 0 2.8-1.7 4.6-4.3 4.6-2.7 0-4.3-1.8-4.3-4.6zm6.8 0c0-2-1-3.1-2.4-3.1-1.5 0-2.4 1.1-2.4 3 0 2 .9 3.2 2.4 3.2s2.4-1.2 2.4-3.1zm3.4-4.6h1.8V23c.2-1 1.2-1.7 2.2-1.7l.6.1v1.8l-.8-.2a1.9 1.9 0 0 0-2 2.1v5.4h-1.8v-9zm13.2 6.4c-.3 1.7-1.9 2.8-4 2.8-2.5 0-4.2-1.8-4.2-4.6s1.7-4.7 4.2-4.7 4 1.8 4 4.5v.6h-6.3v.1a2.4 2.4 0 0 0 2.4 2.6 2 2 0 0 0 2.1-1.3h1.8zm-6.3-2.7h4.5a2.2 2.2 0 0 0-2.2-2.3 2.3 2.3 0 0 0-2.3 2.3zM46.8 8.7a2.6 2.6 0 0 1 2.8 3c0 1.9-1 3-2.8 3h-2.1v-6h2.1zM45.6 14h1.1a1.9 1.9 0 0 0 2-2.2 1.9 1.9 0 0 0-2-2.1h-1.1V14zm5.1-1.6a2.1 2.1 0 1 1 4.2 0 2.1 2.1 0 1 1-4.2 0zm3.3 0c0-1-.4-1.5-1.2-1.5-.8 0-1.2.6-1.2 1.5 0 1 .4 1.6 1.2 1.6.8 0 1.2-.6 1.2-1.6zm6.6 2.3h-1l-.9-3.3-1 3.3h-.9l-1.2-4.5h.9l.8 3.4 1-3.4h.8l1 3.4.8-3.4h1zm2.3-4.5h.8v.7c.3-.5.8-.8 1.4-.8a1.5 1.5 0 0 1 1.6 1.7v2.9h-1V12c0-.7-.2-1-.9-1a1 1 0 0 0-1 1v2.7h-1v-4.5zM68 8.4h1v6.3h-1zm2.2 4a2.1 2.1 0 1 1 4.3 0 2.1 2.1 0 1 1-4.3 0zm3.4 0c0-1-.5-1.5-1.3-1.5-.7 0-1.2.6-1.2 1.5 0 1 .5 1.6 1.2 1.6.8 0 1.3-.6 1.3-1.6zm1.8 1c0-.8.6-1.3 1.7-1.3h1.2v-.5c0-.5-.3-.7-1-.7-.4 0-.8.2-.9.5h-.8c0-.8.8-1.3 1.8-1.3 1.1 0 1.8.6 1.8 1.5v3.1h-.9v-.6a2 2 0 0 1-1.4.7 1.4 1.4 0 0 1-1.5-1.4zm2.9-.4v-.3h-1.1c-.6 0-1 .3-1 .7 0 .4.4.6 1 .6a1 1 0 0 0 1.1-1zm2-.6c0-1.4.8-2.3 2-2.3.5 0 1 .3 1.3.8V8.4h1v6.3h-.9V14c-.4.5-.9.8-1.5.8-1.1 0-1.9-1-1.9-2.4zm1 0c0 1 .4 1.6 1.2 1.6.7 0 1.2-.6 1.2-1.6 0-.9-.5-1.5-1.2-1.5-.8 0-1.2.6-1.2 1.5zm6.9 0a2.1 2.1 0 1 1 4.3 0 2.1 2.1 0 1 1-4.3 0zm3.4 0c0-1-.5-1.5-1.2-1.5-.8 0-1.3.6-1.3 1.5 0 1 .5 1.6 1.3 1.6.7 0 1.2-.6 1.2-1.6zm2.1-2.2h.8v.7c.3-.5.9-.8 1.4-.8a1.5 1.5 0 0 1 1.6 1.7v2.9h-.9V12c0-.7-.3-1-1-1a1 1 0 0 0-1 1v2.7h-1v-4.5zm8.8-1.2v1.2h1v.8h-1v2.3c0 .5.2.7.7.7h.3v.7a3 3 0 0 1-.5 0c-1 0-1.4-.3-1.4-1.2V11h-.7v-.8h.7V9.1h1zm2.2-.6h.9V11c.3-.5.8-.8 1.4-.8a1.5 1.5 0 0 1 1.6 1.7v2.9h-1V12c0-.7-.2-1-.9-1a1 1 0 0 0-1.1 1v2.7h-.9V8.4zm9.1 5.1a2 2 0 0 1-2 1.3 2 2 0 0 1-2-2.3 2 2 0 0 1 2-2.4c1.3 0 2 .9 2 2.3v.3h-3.2a1.2 1.2 0 0 0 1.2 1.3 1 1 0 0 0 1.1-.5h.9zm-3.2-1.5h2.3a1 1 0 0 0-1.1-1.1 1.2 1.2 0 0 0-1.2 1.1z" fill="#FFF"/></g></svg>
\ No newline at end of file diff --git a/web/cobrands/fixmystreet/images/itunes_store_logo@2.png b/web/cobrands/fixmystreet/images/itunes_store_logo@2.png Binary files differdeleted file mode 100644 index af616aada..000000000 --- a/web/cobrands/fixmystreet/images/itunes_store_logo@2.png +++ /dev/null diff --git a/web/js/lazyload.js b/web/js/lazyload.js new file mode 100644 index 000000000..770fc62d4 --- /dev/null +++ b/web/js/lazyload.js @@ -0,0 +1,31 @@ +// jshint esversion: 6 + +(function(){ + if (!('IntersectionObserver' in window)) { + return; + } + + // Now we're here, we can assume quite modern JavaScript! + + const observer = new IntersectionObserver(onIntersection, { + rootMargin: "50px 0px" + }); + + const images = document.querySelectorAll(".js-lazyload"); + images.forEach(image => { + observer.observe(image); + }); + + function onIntersection(entries, observer) { + entries.forEach(entry => { + if (entry.intersectionRatio > 0) { + // Loading the image is the only thing we care about, so can + // stop observing. + observer.unobserve(entry.target); + // Removing this class (which is suppressing background-image) + // will trigger the image load + entry.target.classList.remove('js-lazyload'); + } + }); + } +})(); |
