-
-
Notifications
You must be signed in to change notification settings - Fork 242
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Improve meaningful sequence in report page #5208
base: master
Are you sure you want to change the base?
Changes from all commits
86d457f
69eebd7
e112225
1f1d2a5
e406cd3
5d22f4d
f5c5dd3
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
<a href="#report-list-filters" class="skiplink" aria-label="Skip report tools and jump to reports list">Skip report tools</a> |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,5 +1,10 @@ | ||
[% INCLUDE 'around/_skip-key-tools.html' %] | ||
<div class="shadow-wrap"> | ||
<ul id="key-tools"> | ||
<li><a class="feed js-feed" id="key-tool-around-updates" href="[% email_url | html %]">[% loc("Get updates") %]</a></li> | ||
<li> | ||
<a class="feed js-feed has-inline-svg" id="key-tool-around-updates" href="[% email_url | html %]">[% loc("Get updates") %] | ||
<svg xmlns="http://www.w3.org/2000/svg" width="1.3em" height="1.3em" viewBox="0 0 24 24" fill="currentColor" role="presentation" aria-hidden="true"><path d="M19.199 24C19.199 13.467 10.533 4.8 0 4.8V0c13.165 0 24 10.835 24 24h-4.801zM3.291 17.415c1.814 0 3.293 1.479 3.293 3.295 0 1.813-1.485 3.29-3.301 3.29C1.47 24 0 22.526 0 20.71s1.475-3.294 3.291-3.295zM15.909 24h-4.665c0-6.169-5.075-11.245-11.244-11.245V8.09c8.727 0 15.909 7.184 15.909 15.91z"/></svg> | ||
</a> | ||
</li> | ||
</ul> | ||
</div> |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,2 +1,5 @@ | ||
<a href="[% c.uri_for( '/around', { lat => latitude, lon => longitude } ) %]" | ||
class="problem-back js-back-to-report-list">[% loc('Back to all reports') %]</a> | ||
class="has-inline-svg has-inline-svg--left-align problem-back js-back-to-report-list"> | ||
<svg role="presentation" aria-hidden="true" width="1.5em" height="1.5em" viewBox="0 0 13 16" xmlns="http://www.w3.org/2000/svg"><path d="M6.5 0H13L6.5 8L13 16H6.5L0 8L6.5 0Z" fill="currentColor"/></svg> | ||
[% loc('Back to all reports') %] | ||
</a> |
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -45,18 +45,19 @@ | |
[% END %] | ||
|
||
[% TRY %][% INCLUDE 'report/_message_manager.html' %][% CATCH file %][% END %] | ||
[% INCLUDE 'report/display_tools.html' %] | ||
[% TRY %][% INCLUDE 'report/sharing.html' %][% CATCH file %][% END %] | ||
[% INCLUDE 'report/updates.html' %] | ||
[% INCLUDE 'report/display_tools_mobile.html' %] | ||
|
||
[% IF problem.duplicate_of %] | ||
[% INCLUDE 'report/duplicate-no-updates.html' %] | ||
[% INCLUDE 'report/duplicate-no-updates.html' %] | ||
[% ELSIF problem.cobrand_data == 'noise' %] | ||
<p>[% loc('This report is now closed to updates from the public.') %]</p> | ||
<p>[% loc('This report is now closed to updates from the public.') %]</p> | ||
[% ELSIF NOT shown_form %] | ||
[% PROCESS 'report/update-form-wrapper.html' %] | ||
[% PROCESS 'report/update-form-wrapper.html' %] | ||
[% END %] | ||
|
||
[% INCLUDE 'report/display_tools.html' %] | ||
[% TRY %][% INCLUDE 'report/sharing.html' %][% CATCH file %][% END %] | ||
[% INCLUDE 'report/updates.html' %] | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. The get updates and share things are appearing in the wrong place at mobile width for staff - you click either button and the extra stuff appears too far down, underneath the "Provide an update" button rather than above it. And for non-staff, the buttons aren't working at all, nothing happens when clicked. |
||
</div> | ||
|
||
[% second_column | safe %] | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,43 @@ | ||
<div class="shadow-wrap"> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. This template seems very similar to the non-mobile one, I can combine them later. |
||
<ul id="key-tools-mobile" class="js-key-tools"> | ||
[% IF c.user_exists OR NOT problem.non_public %] | ||
[% IF c.cobrand.users_can_hide AND relevant_staff_user %] | ||
<li><form method="post" action="/report/[% problem.id %]/delete" id="remove-from-site-form"> | ||
<input type="hidden" name="token" value="[% csrf_token %]"> | ||
<button type="submit" id="key-tool-report-abuse" class="has-inline-svg has-inline-svg--column-wrap" data-confirm="[% loc('Are you sure?') %]" name="remove_from_site"> | ||
<svg role="presentation" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="1.5em" height="1.5em" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path fill="currentColor" d="M12.866 3l9.526 16.5a1 1 0 0 1-.866 1.5H2.474a1 1 0 0 1-.866-1.5L11.134 3a1 1 0 0 1 1.732 0zM11 16v2h2v-2h-2zm0-7v5h2V9h-2z"/></svg> | ||
[% loc('Remove from site') %] | ||
</button> | ||
</form></li> | ||
[% ELSIF c.cobrand.moniker != 'zurich' %] | ||
<li><a rel="nofollow" id="key-tool-report-abuse" class="has-inline-svg has-inline-svg--column-wrap" href="[% c.uri_for( '/contact', { id => problem.id } ) %]"> | ||
<svg role="presentation" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="1.5em" height="1.5em" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path fill="currentColor" d="M12.866 3l9.526 16.5a1 1 0 0 1-.866 1.5H2.474a1 1 0 0 1-.866-1.5L11.134 3a1 1 0 0 1 1.732 0zM11 16v2h2v-2h-2zm0-7v5h2V9h-2z"/></svg> | ||
[% c.cobrand.moniker == 'fixmystreet' ? 'Unsuitable?' : loc('Report abuse') %] | ||
</a></li> | ||
[% END %] | ||
[% IF c.cobrand.moniker != 'zurich' %] | ||
<li><a rel="nofollow" class="js-key-tool-report-updates has-inline-svg has-inline-svg--column-wrap" href="[% c.uri_for( '/alert/subscribe', { id => problem.id } ) %]" aria-expanded="false"> | ||
<svg xmlns="http://www.w3.org/2000/svg" width="1.3em" height="1.3em" viewBox="0 0 24 24" fill="currentColor" role="presentation" aria-hidden="true"><path d="M19.199 24C19.199 13.467 10.533 4.8 0 4.8V0c13.165 0 24 10.835 24 24h-4.801zM3.291 17.415c1.814 0 3.293 1.479 3.293 3.295 0 1.813-1.485 3.29-3.301 3.29C1.47 24 0 22.526 0 20.71s1.475-3.294 3.291-3.295zM15.909 24h-4.665c0-6.169-5.075-11.245-11.244-11.245V8.09c8.727 0 15.909 7.184 15.909 15.91z"/></svg> | ||
[% loc('Get updates' ) %] | ||
</a></li> | ||
[% END %] | ||
[% IF c.cobrand.moniker == 'fixmystreet' %] | ||
<li><a rel="nofollow" class="js-key-tool-report-share has-inline-svg has-inline-svg--column-wrap" href="#report-share" aria-expanded="false"> | ||
<svg role="presentation" aria-hidden="true" width="1.5em" height="1.5em" fill="currentColor" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M378,324a69.78,69.78,0,0,0-48.83,19.91L202,272.41a69.68,69.68,0,0,0,0-32.82l127.13-71.5A69.76,69.76,0,1,0,308.87,129l-130.13,73.2a70,70,0,1,0,0,107.56L308.87,383A70,70,0,1,0,378,324Z"/></svg> | ||
[% loc('Share') %] | ||
</a></li> | ||
[% END %] | ||
[% END %] | ||
[% IF c.cobrand.moniker == 'zurich' %] | ||
<li><a class="has-inline-svg has-inline-svg--column-wrap" id="key-tool-problems-nearby" href="[% c.uri_for( '/around', { lat => latitude, lon => longitude } ) %]"> | ||
<svg role="presentation" aria-hidden="true" width="1.5em" height="1.5em" viewBox="0 0 13 16" xmlns="http://www.w3.org/2000/svg"><path d="M6.5 0H0L6.5 8L0 16H6.5L13 8L6.5 0Z" fill="currentColor"/></svg> | ||
[% loc( 'Problems on the map' ) %] | ||
</a></li> | ||
[% ELSE %] | ||
<li><a class="has-inline-svg has-inline-svg--column-wrap" id="key-tool-problems-nearby" href="[% c.uri_for( '/around', { lat => latitude, lon => longitude } ) %]"> | ||
<svg role="presentation" aria-hidden="true" width="1.5em" height="1.5em" viewBox="0 0 13 16" xmlns="http://www.w3.org/2000/svg"><path d="M6.5 0H0L6.5 8L0 16H6.5L13 8L6.5 0Z" fill="currentColor"/></svg> | ||
[% loc( 'Problems nearby' ) %] | ||
</a></li> | ||
[% END %] | ||
</ul> | ||
</div> |
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -27,7 +27,7 @@ | |
[% END %] | ||
[% END %] | ||
|
||
<div class="report-list-filters-wrapper govuk-fieldset-wrapper govuk-small"> | ||
<div id="report-list-filters" class="report-list-filters-wrapper govuk-fieldset-wrapper govuk-small"> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Don't think this ID is used? |
||
|
||
[% IF use_form_wrapper %] | ||
<form method="get" action=""> | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,7 +1,7 @@ | ||
<div id="key-tools-wrapper" class="shadow-wrap"> | ||
<ul id="key-tools"> | ||
<li class="feed-list-wrapper"><a rel="nofollow" id="key-tool-updates-area" class="feed" href="[% rss_url %]">[% | ||
SET monikers = ['bromley','hounslow']; | ||
<li class="feed-list-wrappe"><a rel="nofollow" id="key-tool-updates-area" class="feed has-inline-svg" href="[% rss_url %]"> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Lost an r on wrapper |
||
[% SET monikers = ['bromley','hounslow']; | ||
IF monikers.grep(c.cobrand.moniker).size AND thing == 'council'; | ||
'Get updates of reports in ' _ c.cobrand.moniker.ucfirst; | ||
ELSIF c.cobrand.moniker == 'isleofwight'; | ||
|
@@ -12,13 +12,17 @@ | |
tprintf(loc('Get updates of %s problems'), thing); | ||
ELSE; | ||
tprintf(loc('Get updates of problems in this %s'), thing); | ||
END | ||
%]</a></li> | ||
END %] | ||
<svg xmlns="http://www.w3.org/2000/svg" width="1.5em" height="1.5em" viewBox="0 0 24 24" fill="currentColor" role="presentation" aria-hidden="true"><path d="M19.199 24C19.199 13.467 10.533 4.8 0 4.8V0c13.165 0 24 10.835 24 24h-4.801zM3.291 17.415c1.814 0 3.293 1.479 3.293 3.295 0 1.813-1.485 3.29-3.301 3.29C1.47 24 0 22.526 0 20.71s1.475-3.294 3.291-3.295zM15.909 24h-4.665c0-6.169-5.075-11.245-11.244-11.245V8.09c8.727 0 15.909 7.184 15.909 15.91z"/></svg> | ||
</a></li> | ||
[% IF children.size %] | ||
[% TRY %] | ||
[% INCLUDE 'reports/_rss_other_districts.html' %] | ||
[% CATCH %] | ||
<li><a href="#council_wards" id="key-tool-wards" class="chevron">[% ward_text %]</a></li> | ||
<li><a href="#council_wards" id="key-tool-wards" class="has-inline-svg"> | ||
[% ward_text %] | ||
<svg role="presentation" aria-hidden="true" width="1.5em" height="1.5em" viewBox="0 0 13 16" xmlns="http://www.w3.org/2000/svg"><path d="M6.5 0H0L6.5 8L0 16H6.5L13 8L6.5 0Z" fill="currentColor"/></svg> | ||
</a></li> | ||
[% END %] | ||
[% END %] | ||
</ul> | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is it better to use aria-label or just have the button have the same text as its actual contents?