On mobile, make Report a problem a link that scrolls up to the form.

2 files changed, 7 insertions, 1 deletions

diff --git a/web/cobrands/fixmystreet/base.scss b/web/cobrands/fixmystreet/base.scss
index 97755d8d5..bda29f2cb 100644
--- a/web/cobrands/fixmystreet/base.scss
+++ b/web/cobrands/fixmystreet/base.scss
@@ -512,7 +512,7 @@ p.label-valid {
         font-size: 1.25em;
         border-bottom: 0.25em solid #333;
       }
-      a:hover{
+      a:hover, span.hover {
         background:  #333;
         color:#fff;
         text-decoration: none;
diff --git a/web/cobrands/fixmystreet/fixmystreet.js b/web/cobrands/fixmystreet/fixmystreet.js
index c2801c880..0db8334fb 100644
--- a/web/cobrands/fixmystreet/fixmystreet.js
+++ b/web/cobrands/fixmystreet/fixmystreet.js
@@ -120,6 +120,11 @@ $(function(){
                     .text('Place pin on map')
 	            .prepend('<a href="/">home</a>');
             }
+            $('span.report-a-problem-btn').on('click.reportBtn', function(){
+                $('html, body').animate({scrollTop:0}, 500);
+            }).css({ cursor:'pointer' }).on('hover.reportBtn', function(){
+                $(this).toggleClass('hover');
+            });
         } else {
             // Make map full screen on non-mobile sizes.
             $html.removeClass('mobile');
@@ -146,6 +151,7 @@ $(function(){
                     .prependTo('#side')
                     .text('Click map to report a problem');
             }
+            $('span.report-a-problem-btn').css({ cursor:'' }).off('.reportBtn');
         }
         last_type = type;
     });