diff options
30 files changed, 88 insertions, 38 deletions
diff --git a/perllib/FixMyStreet/Cobrand/Bromley.pm b/perllib/FixMyStreet/Cobrand/Bromley.pm index e098815db..93dd35539 100644 --- a/perllib/FixMyStreet/Cobrand/Bromley.pm +++ b/perllib/FixMyStreet/Cobrand/Bromley.pm @@ -474,6 +474,24 @@ sub construct_bin_date { return $date; } +sub image_for_service { + my ($self, $service_id) = @_; + my $base = '/cobrands/bromley/images/container-images'; + my $images = { + 531 => "$base/refuse-black-sack", + 532 => "$base/refuse-black-sack", + 533 => "$base/large-communal-black", + 535 => "$base/kerbside-green-box-mix", + 536 => "$base/small-communal-mix", + 537 => "$base/kerbside-black-box-paper", + 541 => "$base/small-communal-paper", + 542 => "$base/food-green-caddy", + 544 => "$base/food-communal", + 545 => "$base/garden-waste-bin", + }; + return $images->{$service_id}; +} + sub bin_services_for_address { my $self = shift; my $property = shift; diff --git a/templates/web/base/waste/bin_days.html b/templates/web/base/waste/bin_days.html index e5a1d41c5..12f965e5f 100644 --- a/templates/web/base/waste/bin_days.html +++ b/templates/web/base/waste/bin_days.html @@ -20,42 +20,53 @@ [% FOR unit IN service_data %] <h3 class="govuk-heading-m waste-service-name">[% unit.service_name %]</h3> - -<dl class="govuk-summary-list"> - <div class="govuk-summary-list__row"> - <dt class="govuk-summary-list__key">Frequency</dt> - <dd class="govuk-summary-list__value">[% unit.schedule %]</dd> - </div> - <div class="govuk-summary-list__row"> - <dt class="govuk-summary-list__key">Next collection</dt> - <dd class="govuk-summary-list__value"> - [% IF unit.next %] - [% date.format(unit.next.date) | replace('~~~', unit.next.ordinal) %] - [% IF unit.next.changed %](this collection has been adjusted from its usual time)[% END %] - [% ELSE %] - <i>None</i> - [% END %] - </dd> - </div> - <div class="govuk-summary-list__row"> - <dt class="govuk-summary-list__key">Last collection</dt> - <dd class="govuk-summary-list__value"> - [% IF unit.last %] - [% date.format(unit.last.date) | replace('~~~', unit.last.ordinal) %] - [% IF unit.last.completed %](completed at [% date.format(unit.last.completed, '%l:%M%p') | lower ~%])[% END ~%] - [% IF unit.last.resolution %][% unit.last.resolution | staff_html_markup({ is_body_user => 1 }) %][% END ~%] - [% ELSE %] - <i>None</i> - [% END %] - </dd> +<div class="govuk-grid-row"> + [% SET image = c.cobrand.image_for_service(unit.service_id) ~%] + [% IF image %] + <div class="govuk-grid-column-one-quarter text-centered"> + <img src="[% image %].png" srcset="[% image %].png 1x, [% image %]@2x.png 2x" alt="" class="waste-service-image"> </div> -</dl> -<p class="waste-panel-toggle hidden-nojs"><a data-toggle-visibility="#panel-[% unit.service_id %]" class="waste-service-name-link govuk-button govuk-button--secondary">[% unit.service_name %] services</a></p> + <div class="govuk-grid-column-three-quarters"> + [% ELSE %] + <div class="govuk-grid-column-full"> + [% END %] + <dl class="govuk-summary-list"> + <div class="govuk-summary-list__row"> + <dt class="govuk-summary-list__key">Frequency</dt> + <dd class="govuk-summary-list__value">[% unit.schedule %]</dd> + </div> + <div class="govuk-summary-list__row"> + <dt class="govuk-summary-list__key">Next collection</dt> + <dd class="govuk-summary-list__value"> + [% IF unit.next %] + [% date.format(unit.next.date) | replace('~~~', unit.next.ordinal) %] + [% IF unit.next.changed %](this collection has been adjusted from its usual time)[% END %] + [% ELSE %] + <i>None</i> + [% END %] + </dd> + </div> + <div class="govuk-summary-list__row"> + <dt class="govuk-summary-list__key">Last collection</dt> + <dd class="govuk-summary-list__value"> + [% IF unit.last %] + [% date.format(unit.last.date) | replace('~~~', unit.last.ordinal) %] + [% IF unit.last.completed %](completed at [% date.format(unit.last.completed, '%l:%M%p') | lower ~%])[% END ~%] + [% IF unit.last.resolution %][% unit.last.resolution | staff_html_markup({ is_body_user => 1 }) %][% END ~%] + [% ELSE %] + <i>None</i> + [% END %] + </dd> + </div> + </dl> -<div class="waste-services-launch-panel hidden-js" id="panel-[% unit.service_id %]"> - [% PROCESS waste/services.html %] -</div> + <p class="waste-panel-toggle hidden-nojs"><a data-toggle-visibility="#panel-[% unit.service_id %]" class="waste-service-name-link govuk-button govuk-button--secondary">[% unit.service_name %] services</a></p> + <div class="waste-services-launch-panel hidden-js" id="panel-[% unit.service_id %]"> + [% PROCESS waste/services.html %] + </div> + </div> +</div> [% END %] [% IF NOT service_data.size %] <p>This property has no collections.</p> diff --git a/templates/web/bromley/waste/services_extra.html b/templates/web/bromley/waste/services_extra.html index 5c6fd8c4c..d635c843f 100644 --- a/templates/web/bromley/waste/services_extra.html +++ b/templates/web/bromley/waste/services_extra.html @@ -1,7 +1,15 @@ [% IF domestic_collection %] <h3 class="govuk-heading-m waste-service-name">Batteries, small electrical items and textiles</h3> - -<p>Please only present one small bag each week as we cannot handle high -volumes. If we do not collect your items, please bring them back inside and -present them for collection next week.</p> +<div class="govuk-grid-row"> + <div class="govuk-grid-column-one-quarter text-centered"> + <img src="/cobrands/bromley/images/container-images/electricals-batteries-textiles.png" + srcset="/cobrands/bromley/images/container-images/electricals-batteries-textiles.png 1x, /cobrands/bromley/images/container-images/electricals-batteries-textiles@2x.png 2x" + alt="" class="waste-service-image"> + </div> + <div class="govuk-grid-column-three-quarters"> + <p>Please only present one small bag each week as we cannot handle high + volumes. If we do not collect your items, please bring them back inside and + present them for collection next week.</p> + </div> +</div> [% END %] diff --git a/web/cobrands/bromley/images/container-images/battery-bag.png b/web/cobrands/bromley/images/container-images/battery-bag.png Binary files differnew file mode 100644 index 000000000..8f9c75d74 --- /dev/null +++ b/web/cobrands/bromley/images/container-images/battery-bag.png diff --git a/web/cobrands/bromley/images/container-images/battery-bag@2x.png b/web/cobrands/bromley/images/container-images/battery-bag@2x.png Binary files differnew file mode 100644 index 000000000..16131bf35 --- /dev/null +++ b/web/cobrands/bromley/images/container-images/battery-bag@2x.png diff --git a/web/cobrands/bromley/images/container-images/electricals-batteries-textiles.png b/web/cobrands/bromley/images/container-images/electricals-batteries-textiles.png Binary files differnew file mode 100644 index 000000000..268726215 --- /dev/null +++ b/web/cobrands/bromley/images/container-images/electricals-batteries-textiles.png diff --git a/web/cobrands/bromley/images/container-images/electricals-batteries-textiles@2x.png b/web/cobrands/bromley/images/container-images/electricals-batteries-textiles@2x.png Binary files differnew file mode 100644 index 000000000..579295009 --- /dev/null +++ b/web/cobrands/bromley/images/container-images/electricals-batteries-textiles@2x.png diff --git a/web/cobrands/bromley/images/container-images/food-communal.png b/web/cobrands/bromley/images/container-images/food-communal.png Binary files differnew file mode 100644 index 000000000..51dc74042 --- /dev/null +++ b/web/cobrands/bromley/images/container-images/food-communal.png diff --git a/web/cobrands/bromley/images/container-images/food-communal@2x.png b/web/cobrands/bromley/images/container-images/food-communal@2x.png Binary files differnew file mode 100644 index 000000000..6720b14fd --- /dev/null +++ b/web/cobrands/bromley/images/container-images/food-communal@2x.png diff --git a/web/cobrands/bromley/images/container-images/food-green-caddy.png b/web/cobrands/bromley/images/container-images/food-green-caddy.png Binary files differnew file mode 100644 index 000000000..9483fe19c --- /dev/null +++ b/web/cobrands/bromley/images/container-images/food-green-caddy.png diff --git a/web/cobrands/bromley/images/container-images/food-green-caddy@2x.png b/web/cobrands/bromley/images/container-images/food-green-caddy@2x.png Binary files differnew file mode 100644 index 000000000..db3b71ed5 --- /dev/null +++ b/web/cobrands/bromley/images/container-images/food-green-caddy@2x.png diff --git a/web/cobrands/bromley/images/container-images/garden-waste-bin.png b/web/cobrands/bromley/images/container-images/garden-waste-bin.png Binary files differnew file mode 100644 index 000000000..3c88a9035 --- /dev/null +++ b/web/cobrands/bromley/images/container-images/garden-waste-bin.png diff --git a/web/cobrands/bromley/images/container-images/garden-waste-bin@2x.png b/web/cobrands/bromley/images/container-images/garden-waste-bin@2x.png Binary files differnew file mode 100644 index 000000000..3b5803d7b --- /dev/null +++ b/web/cobrands/bromley/images/container-images/garden-waste-bin@2x.png diff --git a/web/cobrands/bromley/images/container-images/kerbside-black-box-paper.png b/web/cobrands/bromley/images/container-images/kerbside-black-box-paper.png Binary files differnew file mode 100644 index 000000000..b9befa604 --- /dev/null +++ b/web/cobrands/bromley/images/container-images/kerbside-black-box-paper.png diff --git a/web/cobrands/bromley/images/container-images/kerbside-black-box-paper@2x.png b/web/cobrands/bromley/images/container-images/kerbside-black-box-paper@2x.png Binary files differnew file mode 100644 index 000000000..a01ef8a9a --- /dev/null +++ b/web/cobrands/bromley/images/container-images/kerbside-black-box-paper@2x.png diff --git a/web/cobrands/bromley/images/container-images/kerbside-green-box-mix.png b/web/cobrands/bromley/images/container-images/kerbside-green-box-mix.png Binary files differnew file mode 100644 index 000000000..108cf0d59 --- /dev/null +++ b/web/cobrands/bromley/images/container-images/kerbside-green-box-mix.png diff --git a/web/cobrands/bromley/images/container-images/kerbside-green-box-mix@2x.png b/web/cobrands/bromley/images/container-images/kerbside-green-box-mix@2x.png Binary files differnew file mode 100644 index 000000000..764f26f7b --- /dev/null +++ b/web/cobrands/bromley/images/container-images/kerbside-green-box-mix@2x.png diff --git a/web/cobrands/bromley/images/container-images/large-communal-black.png b/web/cobrands/bromley/images/container-images/large-communal-black.png Binary files differnew file mode 100644 index 000000000..d9e030038 --- /dev/null +++ b/web/cobrands/bromley/images/container-images/large-communal-black.png diff --git a/web/cobrands/bromley/images/container-images/large-communal-black@2x.png b/web/cobrands/bromley/images/container-images/large-communal-black@2x.png Binary files differnew file mode 100644 index 000000000..4f06dc47b --- /dev/null +++ b/web/cobrands/bromley/images/container-images/large-communal-black@2x.png diff --git a/web/cobrands/bromley/images/container-images/refuse-black-sack.png b/web/cobrands/bromley/images/container-images/refuse-black-sack.png Binary files differnew file mode 100644 index 000000000..0ecd7956b --- /dev/null +++ b/web/cobrands/bromley/images/container-images/refuse-black-sack.png diff --git a/web/cobrands/bromley/images/container-images/refuse-black-sack@2x.png b/web/cobrands/bromley/images/container-images/refuse-black-sack@2x.png Binary files differnew file mode 100644 index 000000000..e880b1c4e --- /dev/null +++ b/web/cobrands/bromley/images/container-images/refuse-black-sack@2x.png diff --git a/web/cobrands/bromley/images/container-images/small-communal-mix.png b/web/cobrands/bromley/images/container-images/small-communal-mix.png Binary files differnew file mode 100644 index 000000000..f19b7991d --- /dev/null +++ b/web/cobrands/bromley/images/container-images/small-communal-mix.png diff --git a/web/cobrands/bromley/images/container-images/small-communal-mix@2x.png b/web/cobrands/bromley/images/container-images/small-communal-mix@2x.png Binary files differnew file mode 100644 index 000000000..0118142ba --- /dev/null +++ b/web/cobrands/bromley/images/container-images/small-communal-mix@2x.png diff --git a/web/cobrands/bromley/images/container-images/small-communal-paper.png b/web/cobrands/bromley/images/container-images/small-communal-paper.png Binary files differnew file mode 100644 index 000000000..28da47315 --- /dev/null +++ b/web/cobrands/bromley/images/container-images/small-communal-paper.png diff --git a/web/cobrands/bromley/images/container-images/small-communal-paper@2x.png b/web/cobrands/bromley/images/container-images/small-communal-paper@2x.png Binary files differnew file mode 100644 index 000000000..17790b663 --- /dev/null +++ b/web/cobrands/bromley/images/container-images/small-communal-paper@2x.png diff --git a/web/cobrands/bromley/images/container-images/textile-bag.png b/web/cobrands/bromley/images/container-images/textile-bag.png Binary files differnew file mode 100644 index 000000000..f89fda6a7 --- /dev/null +++ b/web/cobrands/bromley/images/container-images/textile-bag.png diff --git a/web/cobrands/bromley/images/container-images/textile-bag@2x.png b/web/cobrands/bromley/images/container-images/textile-bag@2x.png Binary files differnew file mode 100644 index 000000000..0b69f2d0c --- /dev/null +++ b/web/cobrands/bromley/images/container-images/textile-bag@2x.png diff --git a/web/cobrands/bromley/images/container-images/weee-bag.png b/web/cobrands/bromley/images/container-images/weee-bag.png Binary files differnew file mode 100644 index 000000000..1837fbecc --- /dev/null +++ b/web/cobrands/bromley/images/container-images/weee-bag.png diff --git a/web/cobrands/bromley/images/container-images/weee-bag@2x.png b/web/cobrands/bromley/images/container-images/weee-bag@2x.png Binary files differnew file mode 100644 index 000000000..adbdd963d --- /dev/null +++ b/web/cobrands/bromley/images/container-images/weee-bag@2x.png diff --git a/web/cobrands/sass/_waste.scss b/web/cobrands/sass/_waste.scss index 798335578..70a73b255 100644 --- a/web/cobrands/sass/_waste.scss +++ b/web/cobrands/sass/_waste.scss @@ -26,7 +26,7 @@ body.waste { .waste__summary { .govuk-summary-list { font-size: 1em; - border-top: 1px solid #808080; + padding-bottom: 0.66em; background-color: white; } @@ -44,6 +44,13 @@ body.waste { } } +.waste-service-image { + max-width: 100%; + max-height: 140px; + height: auto; + margin-bottom: 1em; +} + .waste__summary { .govuk-button--secondary { font-size: 1em; @@ -109,6 +116,8 @@ body.waste { .waste-service-name.govuk-heading-m { margin-top: 1.5em; + border-bottom: 1px solid #808080; + padding-bottom: 0.5em; } .waste-service-descriptor { @@ -150,3 +159,7 @@ input[type="submit"].waste-service-link { font-size: 1rem; } } + +.text-centered { + text-align: center; +} |
