Bromley front page changes (again, separate template).

3 files changed, 115 insertions, 0 deletions

diff --git a/templates/web/bromley/index.html b/templates/web/bromley/index.html
new file mode 100644
index 000000000..51ec5619a
--- /dev/null
+++ b/templates/web/bromley/index.html
@@ -0,0 +1,105 @@
+[%# Assumes fixmystreet cobrand is using FMS map template - for bonus points preload all the right map elements. %]
+[% map_js = BLOCK %]
+<script>
+yepnope.addPrefix( 'preload', function ( resource ) {
+    resource.noexec = true;
+    return resource;
+});
+Modernizr.load({
+    load: [
+        "preload![% version('/js/OpenLayers.fixmystreet.js') %]",
+        "preload![% version('/js/map-OpenLayers.js') %]",
+        "preload![% version('/js/map-bing-ol.js') %]",
+        "preload![% version('/js/jquery.ba-hashchange.min.js') %]"
+    ]
+});
+</script>
+[% END %]
+
+[% INCLUDE 'header.html', title => '' , bodyclass => 'frontpage fullwidthpage' %]
+
+[% IF error %]
+    <p class="error">[% error %]</p>
+[% END %]
+
+
+<div id="front-main">
+    <div id="front-main-container">
+        <h1>Reporting a problem in Bromley&rsquo;s streets or parks</h1>
+
+        [%
+            question
+                =  c.cobrand.enter_postcode_text()
+                || loc("Enter a nearby GB postcode, or street name and area");
+        %]
+
+        <form action="[% c.uri_for('/around') %]" method="get" name="postcodeForm" id="postcodeForm">
+            <label for="pc">Enter a London Borough of Bromley postcode, or street name and area:</label>
+            <div>
+                <input type="text" name="pc" value="" id="pc" size="10" maxlength="200" placeholder="[% tprintf(loc('e.g. ‘%s’ or ‘%s’'), c.cobrand.example_places) %]">
+                <input type="submit" value="[% loc('Go') %]" id="submit">
+            </div>
+        </form>
+
+        <p>This is primarily for reporting physical problems that can be fixed
+        like graffiti, fly tipping, or broken paving slabs to report other
+        kinds of problems like missed bins use our
+        <a href="http://www.bromley.gov.uk/report">online report it forms</a>.
+        </p>
+
+    </div>
+</div>
+
+<div class="tablewrapper">
+    <div id="front-howto">
+        <h2>[% loc('How to report a problem') %]</h2>
+        
+        <ol class="big-numbers">
+            <li>[% question %]</li>
+            <li>[% loc('Locate the problem on a map of the area') %]</li>
+            <li>[% loc('Enter details of the problem') %]</li>
+            <li>It gets sent to the council</li>
+        </ol>
+        
+        <section class="full-width">
+        [% INCLUDE "front/stats.html" %]
+        [% TRY %][% INCLUDE "front/tips.html" %][% CATCH file %][% END %]
+        </section>
+    </div>
+
+
+    [% 
+        recent_photos = c.cobrand.recent_photos(5);
+    %]
+
+    [% IF recent_photos.size %]
+    <div id="front-recently">
+        <h2>[% loc('Recently reported problems') %]</h2>
+
+        <section class="full-width">
+            <ul class="issue-list-a">
+            [% FOREACH p IN recent_photos %]
+                <li>
+                    <a href="/report/[% p.id %]">
+                        <div class="text">
+                            <h4>[% p.title | html %]</h4>
+                            <small>[% prettify_epoch( p.confirmed_local.epoch, 1 ) %]</small>
+                        </div>
+                        <div class="img">
+                            <img alt="[% p.title | html %]" title="[% p.title | html %]" height="60" width="90" src="/photo/[% p.id %].fp.jpeg">
+                        </div>
+                    </a>
+                </li>    
+            [% END %]
+            </ul>
+        </section>
+
+    </div>
+    [% END %]
+</div>
+
+
+<!-- [% TRY %][% INCLUDE 'front/news.html' %][% CATCH file %][% END %] -->
+
+
+[% INCLUDE 'footer.html' pagefooter = 'yes' %]
diff --git a/web/cobrands/bromley/layout.scss b/web/cobrands/bromley/layout.scss
index 2724ac83b..4b873ad05 100644
--- a/web/cobrands/bromley/layout.scss
+++ b/web/cobrands/bromley/layout.scss
@@ -1,6 +1,7 @@
 @import "_colours";
 @import "../fixmystreet/_layout";
 
+// So that map appears underneath the header
 .wrapper {
     position: relative;
 }
@@ -61,6 +62,7 @@ body.mappage .content {
     }
 }
 
+// As map can scroll and isn't at the top, give it an edge
 #map_box {
     border-top: solid 1px #666;
     border-bottom: solid 1px #666;
diff --git a/web/cobrands/fixmystreet/_layout.scss b/web/cobrands/fixmystreet/_layout.scss
index 5fb65ee72..4e7e29e3b 100644
--- a/web/cobrands/fixmystreet/_layout.scss
+++ b/web/cobrands/fixmystreet/_layout.scss
@@ -899,10 +899,18 @@ body.frontpage {
       }
     }
   }
+  a {
+    color: $primary_text;
+    text-decoration: underline;
+    &:hover {
+      text-decoration: none;
+    }
+  }
   a#geolocate_link {
     background:none;
     color:#222;
     margin:-1em 0 0.5em 0;
+    text-decoration: none;
     &:hover {
       text-decoration:underline;
       background:none;