diff options
-rw-r--r-- | templates/web/base/admin/report_blocks.html | 2 | ||||
-rw-r--r-- | templates/web/base/report/_item.html | 56 | ||||
-rw-r--r-- | web/cobrands/oxfordshire/base.scss | 11 | ||||
-rw-r--r-- | web/cobrands/sass/_base.scss | 84 | ||||
-rw-r--r-- | web/cobrands/sass/_mixins.scss | 7 |
5 files changed, 156 insertions, 4 deletions
diff --git a/templates/web/base/admin/report_blocks.html b/templates/web/base/admin/report_blocks.html index 3561d865d..1dd4c9dd0 100644 --- a/templates/web/base/admin/report_blocks.html +++ b/templates/web/base/admin/report_blocks.html @@ -1,5 +1,7 @@ [% +SET report_blocks_included = 1; + SET state_pretty = { 'confirmed' = loc('Open') 'investigating' = loc('Investigating') diff --git a/templates/web/base/report/_item.html b/templates/web/base/report/_item.html index 0f42b00ce..939dc5da6 100644 --- a/templates/web/base/report/_item.html +++ b/templates/web/base/report/_item.html @@ -1,9 +1,16 @@ +[% IF NOT report_blocks_included ~%] +[% PROCESS 'admin/report_blocks.html' ~%] +[% END ~%] + <li class="item-list__item item-list--reports__item [% item_extra_class %]" data-report-id="[% problem.id | html %]"> <a href="[% c.cobrand.base_url_for_report( problem ) %][% problem.url %]"> [% IF problem.photo %] <img class="img" height="60" width="90" src="[% problem.photos.first.url_fp %]" alt=""> [% END %] <h3 class="item-list__heading">[% problem.title | html %]</h3> + [% IF c.user.has_permission_to('report_inspect', problem.bodies_str_ids) %] + <div class="item-list__description">[% problem.detail | html %]</div> + [% END %] <small> [%- IF c.cobrand.moniker != 'fixamingata' %] [%# Default: %] [%- prettify_dt( problem.confirmed, 1 ) %] @@ -27,5 +34,54 @@ [% loc('(closed)') %] [% END %] </small> + + [% IF c.user.has_permission_to('report_inspect', problem.bodies_str_ids) %] + <div class="item-list__item__metadata"> + <div> + <h4>[% loc('Report ID:') %]</h4> + <p>[% problem.id %]</p> + </div> + [% IF problem.local_coords %] + <div> + <h4>[% loc('Easting/Northing:') %]</h4> + <p>[% problem.local_coords.0 %], [% problem.local_coords.1 %]</p> + </div> + [% END %] + <div> + <h4>[% loc('Latitude/Longitude:') %]</h4> + <p>[% problem.latitude %], [% problem.longitude %]</p> + </div> + <div> + <h4>[% loc('Category') %]</h4> + <p>[% (problem.category OR '-') | html %]</p> + </div> + <div> + <h4>[% loc('State') %]</h4> + <p>[% state_pretty.${problem.state} %]</p> + </div> + <div> + <h4>[% loc('Priority') %]</h4> + <p>[% problem.response_priority.name OR '-' %]</p> + </div> + <div> + <h4>[% loc('Traffic management required?') %]</h4> + <p>[% problem.get_extra_metadata('traffic_information') %]</p> + </div> + <div> + <h4>[% loc('Extra details') %]</h4> + <p>[% problem.get_extra_metadata('detailed_information') | html %]</p> + </div> + [% SET fields = problem.get_extra_fields; IF fields.size %] + [% FOR f IN fields %] + <div> + <h4>[% f.name %]</h4> + <p>[% f.value %]</p> + </div> + [% END %] + [% END %] + </div> + [% END %] + + </a> </li> diff --git a/web/cobrands/oxfordshire/base.scss b/web/cobrands/oxfordshire/base.scss index 955c341bf..72ddbd437 100644 --- a/web/cobrands/oxfordshire/base.scss +++ b/web/cobrands/oxfordshire/base.scss @@ -87,3 +87,14 @@ dd, p { #fff ); } + +@media print { + body { + background-color: #fff !important; + } + + .mappage #oxford-header, + .mappage #side > .extra-text { + display: none !important; + } +} diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss index 7fb0c797f..93e3cf201 100644 --- a/web/cobrands/sass/_base.scss +++ b/web/cobrands/sass/_base.scss @@ -925,6 +925,14 @@ input.final-submit { margin: 0.25em 0 0; padding: 0.5em 1em; display: block; + + @media print { + background-color: transparent !important; + margin: 0 !important; + padding: 1em 0 !important; + border-top: 1px solid #ccc; + page-break-inside: avoid; + } } .item-list__update-wrap { @@ -954,28 +962,75 @@ input.final-submit { .item-list--reports__item { @extend %item-list__item--link; + a { @include clearfix; padding: flip(0 0 0 1em, 0 1em 0 0); + + @media print { + padding: 0; + } } + .img { width: 90px; float: $right; height: auto; margin-#{$left}: 1em; } + small { color: #666; display: block; padding: 0.25em 0; } } + +.item-list__item__metadata { + display: none; + + @media print { + display: block; + @include flex-container(); + @include flex-wrap(wrap); + } + + & > * { + margin-top: 0.5em; + width: 33%; + @include flex(0 0 auto); + } + + h4 { + margin: 0; + font-size: 0.75em; + font-weight: bold; + } + + p { + margin-bottom: 0; + min-height: 1.4em; + } +} + .item-list__heading { font-size: 1em; font-weight: normal; line-height: 1.5; padding-top: 0.25em; margin: 0; + + @media print { + font-weight: bold; + } +} + +.item-list__description { + display: none; + + @media print { + display: block; + } } .item-list__item--empty p { @@ -1987,15 +2042,36 @@ table.nicetable { #sub_map_links, #fms_pan_zoom, .screen-only, - .olMapViewport { + .olMapViewport, + .big-green-banner, + .click-the-map, + #skip-this-step, + .my-account-buttons { display: none !important; } - #map_box { + #site-header { + display: block !important; + position: static !important; + } + + #map_box, + #map_sidebar { position: static !important; - height: 256px !important; width: auto !important; - background: #f1eee9 !important; // cream colour to match OSM image + background: transparent !important; + } + + #map_box { + float: right !important; + width: 256px !important; + height: 256px !important; + margin: 0 0 1em 1em !important; + } + + #map_sidebar { + // Prevent sidebar from clearing below floated map + overflow: visible !important; } #map { diff --git a/web/cobrands/sass/_mixins.scss b/web/cobrands/sass/_mixins.scss index 6d4f523ce..2b05b3c21 100644 --- a/web/cobrands/sass/_mixins.scss +++ b/web/cobrands/sass/_mixins.scss @@ -158,6 +158,13 @@ $right: right; flex: $values; } +@mixin flex-wrap($wrap) { + -webkit-box-wrap: $wrap; + -webkit-flex-wrap: $wrap; + -ms-flex-wrap: $wrap; + flex-wrap: $wrap; +} + @mixin flex-align($alignment) { -webkit-box-align: $alignment; -webkit-align-items: $alignment; |