diff options
| -rw-r--r-- | templates/web/fixmystreet/report/new/fill_in_details_form.html | 216 | ||||
| -rw-r--r-- | web/cobrands/fixmystreet/base.scss | 9 | ||||
| -rw-r--r-- | web/cobrands/fixmystreet/images/cross-7px-7px.png | bin | 0 -> 158 bytes | |||
| -rw-r--r-- | web/cobrands/fixmystreet/images/tick-10px-8px.png | bin | 0 -> 141 bytes | |||
| -rw-r--r-- | web/cobrands/fixmystreet/images/wrong-location.png | bin | 0 -> 316 bytes | |||
| -rw-r--r-- | web/cobrands/fixmystreet/layout.scss | 6 | ||||
| -rw-r--r-- | web/cobrands/sass/_base.scss | 62 |
7 files changed, 192 insertions, 101 deletions
diff --git a/templates/web/fixmystreet/report/new/fill_in_details_form.html b/templates/web/fixmystreet/report/new/fill_in_details_form.html index 9f25145a7..6ad5484e0 100644 --- a/templates/web/fixmystreet/report/new/fill_in_details_form.html +++ b/templates/web/fixmystreet/report/new/fill_in_details_form.html @@ -1,125 +1,139 @@ <div id="report-a-problem-main"> - <h1>[% loc('Reporting a problem') %]</h1> - - [% IF js %] - <p id="councils_text"> - [% - tprintf( - loc('All the information you provide here will be sent to <strong>%s</strong>.'), - loc('the local council') - ); - %] - [% loc('The subject and details of the problem will be public, plus your name if you give us permission.') %] - </p> - [% ELSE %] - [% PROCESS 'report/new/councils_text.html' %] - [% END %] - - [% IF c.cobrand.moniker != 'fixmybarangay' || ( c.user && c.user.from_body ) %] + <h1>[% loc('Report your problem') %]</h1> + + [% IF c.cobrand.moniker == 'fixmystreet' %] + <p class="change_location">[% loc('Wrong location? Just click again on the map.') %]</p> + [% END %] + + [% IF js %] + <p id="councils_text"> + [% tprintf( + loc('All the information you provide here will be sent to <strong>%s</strong>.'), + loc('the local council') + ); %] + [% loc('The summary and description will also be made public (see our <a href="/privacy">privacy policy</a>).') %] + </p> + [% ELSE %] + [% PROCESS 'report/new/councils_text.html' %] + [% END %] + + [% IF c.cobrand.moniker == "fixmystreet" && report.used_map && partial_token %] + <p id="unknown">[% loc('Please note your report has <strong>not yet been sent</strong>. Choose a category and add further information below, then submit.') %]</p> + [% END %] + + [% IF c.cobrand.moniker != "fixmystreet" && (c.cobrand.moniker != 'fixmybarangay' || ( c.user && c.user.from_body ) ) %] <div id="report-a-problem-sidebar"> - <!-- - The text for this section needs checking, but I can't work out which bit comes from where - --> <div class="sidebar-tips"> - [% IF report.used_map %] - [% IF partial_token %] - <p id="unknown">[% loc('Please note your report has <strong>not yet been sent</strong>. Choose a category and add further information below, then submit.') %]</p> - [% END %] + [% IF report.used_map %] + [% IF partial_token %] + <p id="unknown">[% loc('Please note your report has <strong>not yet been sent</strong>. Choose a category and add further information below, then submit.') %]</p> + [% END %] + <p>[% loc('You have located the problem at the point marked with a green pin on the map. If this is not the correct location, simply click on the map again. ') %]</p> - [% END %] + [% END %] <p> - [% IF report.used_map %] + [% IF report.used_map %] [% INCLUDE 'report/new/fill_in_details_text.html' %] - [% ELSE %] + [% ELSE %] [% loc('Please fill in the form below with details of the problem, and describe the location as precisely as possible in the details box.') %] - [% END %] + [% END %] </p> </div> - <div class="sidebar-notes"> [% INCLUDE 'report/new/notes.html' %] </div> - </div> - [% END %] + [% END %] + + [% INCLUDE 'errors.html' %] - [% INCLUDE 'errors.html' %] <fieldset> <div id="problem_form"> - [% INCLUDE 'report/new/form_heading.html' %] - - - [% IF field_errors.bodies %] - <p class='form-error'>[% field_errors.bodies %]</p> - [% END %] - - - - <label for="form_title">[% loc('Subject') %]</label> - [% IF field_errors.title %] - <p class='form-error'>[% field_errors.title %]</p> - [% END %] - <input type="text" value="[% report.title | html %]" name="title" id="form_title" placeholder="[% loc('Provide a title') %]" required> - - <label for="form_detail">[% loc('Details') %]</label> - [% IF field_errors.detail %] - <p class='form-error'>[% field_errors.detail %]</p> - [% END %] - <textarea rows="7" cols="26" name="detail" id="form_detail" placeholder="[% loc('Please fill in details of the problem.') %]" required>[% report.detail | html %]</textarea> - - [% IF js %] - <div id="form_category_row"> - <label for="form_category">[% loc('Category') %]</label> - <select name="category" id="form_category" required><option>[% loc('Loading...') %]</option></select> - </div> - [% ELSE %] - [% IF category_options.size %] - [% IF field_errors.category %] - <p class='form-error'>[% field_errors.category %]</p> - [% END %] - - [% PROCESS "report/new/category.html" %] - [% END %] - [% END %] - - [%- IF category_extras %] - [% PROCESS "report/new/category_extras.html" %] - [%- END %] - - [% IF c.cobrand.allow_photo_upload %] - <label for="form_photo">[% loc('Photo') %]</label> - [% IF upload_fileid || report.photo %] - [% IF upload_fileid %] - <img align="right" src="/photo/[% upload_fileid %].temp.jpeg" alt=""> - <input type="hidden" name="upload_fileid" value="[% upload_fileid %]"> - [% END %] - - <p>[% loc('You have already attached a photo to this report, attaching another one will replace it.') %]</p> - - [% IF report.photo %] - <img align="right" src="/photo/[% report.id %].jpeg"> - [% END %] - [% END %] - - [% IF field_errors.photo %] - <p class='form-error'>[% field_errors.photo %]</p> - [% END %] - <input type="file" name="photo" id="form_photo"> - [% END %] - - [% IF c.user_exists %] - [% PROCESS "report/new/form_user_loggedin.html" %] - [% ELSE %] - [% PROCESS "report/new/form_user_loggedout.html" %] - [% END %] + [% INCLUDE 'report/new/form_heading.html' %] + + [% IF field_errors.bodies %] + <p class='form-error'>[% field_errors.bodies %]</p> + [% END %] + + <label for="form_title">[% loc('One-line summary <span class="muted">(public)</span>') %]</label> + [% IF field_errors.title %] + <p class='form-error'>[% field_errors.title %]</p> + [% END %] + <input type="text" value="[% report.title | html %]" name="title" id="form_title" placeholder="[% loc('What’s the issue, and where is it?') %]" required> + + <label for="form_detail">[% loc('Description <span class="muted">(public)</span>') %]</label> + [% IF field_errors.detail %] + <p class='form-error'>[% field_errors.detail %]</p> + [% END %] + <textarea rows="7" cols="26" name="detail" id="form_detail" placeholder="[% loc('Explain what’s wrong, exactly where it is, and how long it’s been there…') %]" required>[% report.detail | html %]</textarea> + + [% IF c.cobrand.moniker == "fixmystreet" %] + <div class="description_tips"> + <h4>Tips for successful reports:</h4> + <ul class="do"> + <li>Be polite</li> + <li>Use exact locations</li> + <li>Say how long the issue’s been present</li> + </ul> + <ul class="dont"> + <li>Don’t leave abusive or libellous messages</li> + <li>Don’t include private contact details in the description</li> + </ul> + </div> + [% END %] + + [% IF js %] + <div id="form_category_row"> + <label for="form_category">[% loc('Category') %]</label> + <select name="category" id="form_category" required><option>[% loc('Loading...') %]</option></select> + </div> + [% ELSE %] + [% IF category_options.size %] + [% IF field_errors.category %] + <p class='form-error'>[% field_errors.category %]</p> + [% END %] + [% PROCESS "report/new/category.html" %] + [% END %] + [% END %] + + [%- IF category_extras %] + [% PROCESS "report/new/category_extras.html" %] + [%- END %] + + [% IF c.cobrand.allow_photo_upload %] + <label for="form_photo">[% loc('Photo') %]</label> + [% IF upload_fileid || report.photo %] + [% IF upload_fileid %] + <img align="right" src="/photo/[% upload_fileid %].temp.jpeg" alt=""> + <input type="hidden" name="upload_fileid" value="[% upload_fileid %]"> + [% END %] + + <p>[% loc('You have already attached a photo to this report, attaching another one will replace it.') %]</p> + + [% IF report.photo %] + <img align="right" src="/photo/[% report.id %].jpeg"> + [% END %] + [% END %] + + [% IF field_errors.photo %] + <p class='form-error'>[% field_errors.photo %]</p> + [% END %] + <input type="file" name="photo" id="form_photo"> + [% END %] + + [% IF c.user_exists %] + [% PROCESS "report/new/form_user_loggedin.html" %] + [% ELSE %] + [% PROCESS "report/new/form_user_loggedout.html" %] + [% END %] </div> </fieldset> - [% IF partial_token %] - <input type="hidden" name="partial" value="[% partial_token.token %]"> - [% END %] + [% IF partial_token %] + <input type="hidden" name="partial" value="[% partial_token.token %]"> + [% END %] <input type="hidden" name="submit_problem" value="1"> </div> diff --git a/web/cobrands/fixmystreet/base.scss b/web/cobrands/fixmystreet/base.scss index c33f927f8..c849b72c9 100644 --- a/web/cobrands/fixmystreet/base.scss +++ b/web/cobrands/fixmystreet/base.scss @@ -21,6 +21,15 @@ #message_close { float: right; } } +body.mappage { + .change_location { + color: #666; + padding-left: 24px; + background: transparent url(images/wrong-location.png) 4px 50% no-repeat; + margin-top: -0.5em; + } +} + .confirmation-header { padding: 2em 1em; diff --git a/web/cobrands/fixmystreet/images/cross-7px-7px.png b/web/cobrands/fixmystreet/images/cross-7px-7px.png Binary files differnew file mode 100644 index 000000000..6c5f41171 --- /dev/null +++ b/web/cobrands/fixmystreet/images/cross-7px-7px.png diff --git a/web/cobrands/fixmystreet/images/tick-10px-8px.png b/web/cobrands/fixmystreet/images/tick-10px-8px.png Binary files differnew file mode 100644 index 000000000..09b036f61 --- /dev/null +++ b/web/cobrands/fixmystreet/images/tick-10px-8px.png diff --git a/web/cobrands/fixmystreet/images/wrong-location.png b/web/cobrands/fixmystreet/images/wrong-location.png Binary files differnew file mode 100644 index 000000000..8f775f710 --- /dev/null +++ b/web/cobrands/fixmystreet/images/wrong-location.png diff --git a/web/cobrands/fixmystreet/layout.scss b/web/cobrands/fixmystreet/layout.scss index 3f707f619..196545670 100644 --- a/web/cobrands/fixmystreet/layout.scss +++ b/web/cobrands/fixmystreet/layout.scss @@ -302,3 +302,9 @@ body.alertindex { display: none; } } + +#report-a-problem-main { + input[type=text], input[type=password], input[type=email], textarea { + max-width: 27em; + } +} diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss index 4e3dea444..477bb27c1 100644 --- a/web/cobrands/sass/_base.scss +++ b/web/cobrands/sass/_base.scss @@ -356,6 +356,17 @@ label{ } } +#report-a-problem-main { + fieldset { + margin: 0; + } + + .form-box { + margin: 0 -1em 0.25em -1em; + padding: 1em; + } +} + .form-txt-submit-box { min-height:3em; input[type=password], @@ -1304,6 +1315,57 @@ a:hover.rap-notes-trigger { } +/* Reporting a problem bits */ + +label .muted { + color: #888; + font-weight: normal; +} + +.description_tips { + @include clearfix; + + h4 { + margin: 0.5em 0; + } + + ul { + width: 49%; + margin: 0; + float: left; + font-size: 14px; + line-height: 20px; + } + + li { + margin-bottom: 0; + padding-left: 20px; + list-style: none; + background: transparent url(images/tick-10px-8px.png) 4px 5px no-repeat; + } + + .do { + color: #1c8012; + } + + .dont { + float: right; + color: #881111; + + li { + background-image: url(images/cross-7px-7px.png); + background-position: 6px 6px; + } + } +} + +#problem_form { + label:first-child { + margin-top: 0; + } +} + + table.nicetable { width:100%; margin-bottom:2em; |
