diff options
-rw-r--r-- | templates/web/fixmystreet/report/new/fill_in_details_form.html | 289 | ||||
-rw-r--r-- | templates/web/fixmystreet/report/new/notes.html | 2 | ||||
-rw-r--r-- | web/cobrands/fixmystreet/base.scss | 17 | ||||
-rw-r--r-- | web/cobrands/fixmystreet/config.rb | 3 | ||||
-rw-r--r-- | web/cobrands/fixmystreet/layout.scss | 30 | ||||
-rw-r--r-- | web/js/fixmystreet.js | 8 | ||||
-rw-r--r-- | web/js/map-OpenLayers.js | 2 |
7 files changed, 201 insertions, 150 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 5f4a6a7b7..1ac67797c 100644 --- a/templates/web/fixmystreet/report/new/fill_in_details_form.html +++ b/templates/web/fixmystreet/report/new/fill_in_details_form.html @@ -1,190 +1,197 @@ -<h1>[% loc('Reporting a problem') %]</h1> +<div id="report-a-poblem-main"> + <h1>[% loc('Reporting a problem') %]</h1> + + <div id="report-a-poblem-sidebar"> + + <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 %] + <p>[% loc('You have located the problem at the point marked with a purple pin on the map. If this is not the correct location, simply click on the map again. ') %]</p> + [% END %] -<div id="report-a-poblem-sidebar"> - - [% 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 purple pin on the map. If this is not the correct location, simply click on the map again. ') %]</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 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 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 %] + <p> + [% IF report.used_map %] + [% INCLUDE 'report/new/fill_in_details_text.html' %] + [% 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 %] + </p> + </div> + + <div class="sidebar-notes"> + [% INCLUDE 'report/new/notes.html' %] + </div> - <p> - [% IF report.used_map %] - [% INCLUDE 'report/new/fill_in_details_text.html' %] - [% 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 %] - </p> + </div> - [% INCLUDE 'report/new/notes.html' %] -</div> + [% INCLUDE 'errors.html' %] + <fieldset> + <div id="problem_form"> -[% INCLUDE 'errors.html' %] -<fieldset> - <div id="problem_form"> + [% INCLUDE 'report/new/form_heading.html' %] - [% INCLUDE 'report/new/form_heading.html' %] + [% IF field_errors.council %] + <p class='form-error'>[% field_errors.council %]</p> + [% END %] - [% IF field_errors.council %] - <p class='form-error'>[% field_errors.council %]</p> - [% END %] + [% IF field_errors.title %] + <p class='form-error'>[% field_errors.title %]</p> + [% END %] - [% IF field_errors.title %] - <p class='form-error'>[% field_errors.title %]</p> - [% END %] + <label for="form_title">[% loc('Subject:') %]</label> + <input type="text" value="[% report.title | html %]" name="title" id="form_title" required> - <label for="form_title">[% loc('Subject:') %]</label> - <input type="text" value="[% report.title | html %]" name="title" id="form_title" required> + [% IF field_errors.detail %] + <p class='form-error'>[% field_errors.detail %]</p> + [% END %] - [% IF field_errors.detail %] - <p class='form-error'>[% field_errors.detail %]</p> - [% END %] + <label for="form_detail">[% loc('Details:') %]</label> + <textarea name="detail" id="form_detail" required>[% report.detail | html %]</textarea> - <label for="form_detail">[% loc('Details:') %]</label> - <textarea name="detail" id="form_detail" 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 %] - [% 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> + [% PROCESS "report/new/category.html" %] [% END %] - - [% PROCESS "report/new/category.html" %] [% END %] - [% END %] - [%- IF category_extras %] - [% PROCESS "report/new/category_extras.html" %] - [%- END %] + [%- IF category_extras %] + [% PROCESS "report/new/category_extras.html" %] + [%- END %] - [% IF c.cobrand.allow_photo_upload %] - [% IF field_errors.photo %] - <p class='form-error'>[% field_errors.photo %]</p> - [% END %] - - - [% IF upload_fileid || report.photo %] - <p>[% loc('You have already attached a photo to this report, attaching another one will replace it.') %]</p> - - [% IF upload_fileid %] - <input type="hidden" name="upload_fileid" value="[% upload_fileid %]" /> + [% IF c.cobrand.allow_photo_upload %] + [% IF field_errors.photo %] + <p class='form-error'>[% field_errors.photo %]</p> [% END %] + + + [% IF upload_fileid || report.photo %] + <p>[% loc('You have already attached a photo to this report, attaching another one will replace it.') %]</p> + + [% IF upload_fileid %] + <input type="hidden" name="upload_fileid" value="[% upload_fileid %]" /> + [% END %] - [% IF report.photo %] - <img align="right" src="/photo?id=[% report.id %]"> + [% IF report.photo %] + <img align="right" src="/photo?id=[% report.id %]"> + [% END %] [% END %] + + <label for="form_photo">[% loc('Photo:') %]</label> + <input type="file" name="photo" id="form_photo"> [% END %] - - <label for="form_photo">[% loc('Photo:') %]</label> - <input type="file" name="photo" id="form_photo"> - [% END %] - [% IF c.user_exists %] + [% IF c.user_exists %] - [% INCLUDE name_phone %] + [% INCLUDE name_phone %] - <p id="problem_submit"> - <input type="submit" value="[% loc('Submit') %]"> - </p> + <p id="problem_submit"> + <input type="submit" value="[% loc('Submit') %]"> + </p> - [% ELSE %] + [% ELSE %] - [% IF field_errors.email %] - <p class='form-error'>[% field_errors.email %]</p> - [% END %] + [% IF field_errors.email %] + <p class='form-error'>[% field_errors.email %]</p> + [% END %] - <label for="form_email">[% loc('Your email:') %]</label> - <input type="email" value="[% report.user.email | html %]" name="email" id="form_email" size="25" required> + <label for="form_email">[% loc('Your email:') %]</label> + <input type="email" value="[% report.user.email | html %]" name="email" id="form_email" size="25" required> - <div id="form_sign_in"> - <h3>[% loc("Now to submit your report… do you have a FixMyStreet password?") %]</h3> + <div id="form_sign_in"> + <h3>[% loc("Now to submit your report… do you have a FixMyStreet password?") %]</h3> - <div id="form_sign_in_yes"> - [% IF field_errors.password %] - <p class='form-error'>[% field_errors.password %]</p> - [% END %] + <div id="form_sign_in_yes"> + [% IF field_errors.password %] + <p class='form-error'>[% field_errors.password %]</p> + [% END %] - <label class="n" for="password_sign_in">[% loc('<strong>Yes</strong>, I have a password:') %]</label> - <input type="password" name="password_sign_in" id="password_sign_in" value=""> + <label class="n" for="password_sign_in">[% loc('<strong>Yes</strong>, I have a password:') %]</label> + <input type="password" name="password_sign_in" id="password_sign_in" value=""> - <p> - <input type="checkbox" id="remember_me" name="remember_me" value='1'[% ' checked' IF remember_me %]> - <label class="n" for="remember_me">[% loc('Keep me signed in on this computer') %]</label> - </p> + <p> + <input type="checkbox" id="remember_me" name="remember_me" value='1'[% ' checked' IF remember_me %]> + <label class="n" for="remember_me">[% loc('Keep me signed in on this computer') %]</label> + </p> - <p> - <input type="submit" id="submit_sign_in" name="submit_sign_in" value="[% loc('Submit') %]"> - </p> - </div> + <p> + <input type="submit" id="submit_sign_in" name="submit_sign_in" value="[% loc('Submit') %]"> + </p> + </div> - <div id="form_sign_in_no"> - <p>[% loc('<strong>No</strong>, let me confirm my report by email:') %]</p> + <div id="form_sign_in_no"> + <p>[% loc('<strong>No</strong>, let me confirm my report by email:') %]</p> - [% INCLUDE name_phone %] - - <label for="password_register">[% loc('Enter a new password:') %]</label> - <input type="password" name="password_register" id="password_register" value=""> - + [% INCLUDE name_phone %] + + <label for="password_register">[% loc('Enter a new password:') %]</label> + <input type="password" name="password_register" id="password_register" value=""> + - <p><small>[% loc('Providing a password is optional, but doing so will allow you to more easily report problems, leave updates and manage your reports.') %]</small></p> + <p><small>[% loc('Providing a password is optional, but doing so will allow you to more easily report problems, leave updates and manage your reports.') %]</small></p> - <p> - <input type="submit" id="submit_register" name="submit_register" value="[% loc('Submit') %]"> - </p> + <p> + <input type="submit" id="submit_register" name="submit_register" value="[% loc('Submit') %]"> + </p> - </div> + </div> - </div> + </div> - [% END %] - </div> -</fieldset> + [% 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"> + <input type="hidden" name="submit_problem" value="1"> -[% BLOCK name_phone %] - [% IF field_errors.name %] - <p class='form-error'>[% field_errors.name %]</p> - [% END %] + [% BLOCK name_phone %] + [% IF field_errors.name %] + <p class='form-error'>[% field_errors.name %]</p> + [% END %] - <label for="form_name">[% loc('Your name:') %]</label> - <input type="text" class="validName" value="[% report.name | html %]" name="name" id="form_name"> + <label for="form_name">[% loc('Your name:') %]</label> + <input type="text" class="validName" value="[% report.name | html %]" name="name" id="form_name"> - [%# if there is nothing in the name field then set check box as default on form %] - <input type="checkbox" name="may_show_name" id="form_may_show_name" value="1"[% ' checked' IF !report.anonymous %]> - <label for="form_may_show_name">[% loc('Show my name publicly') %]</label> - <p><small>[% loc('(we never show your email address or phone number)') %]</small></p> + [%# if there is nothing in the name field then set check box as default on form %] + <input type="checkbox" name="may_show_name" id="form_may_show_name" value="1"[% ' checked' IF !report.anonymous %]> + <label for="form_may_show_name">[% loc('Show my name publicly') %]</label> + <p><small>[% loc('(we never show your email address or phone number)') %]</small></p> - <label for="form_phone">[% loc('Phone:') %]</label> - <input type="text" value="[% report.user.phone | html %]" name="phone" id="form_phone" size="15"> - <p><small>[% loc('(optional)') %]</small></p> -[% END %]
\ No newline at end of file + <label for="form_phone">[% loc('Phone:') %]</label> + <input type="text" value="[% report.user.phone | html %]" name="phone" id="form_phone" size="15"> + <p><small>[% loc('(optional)') %]</small></p> + [% END %] +</div>
\ No newline at end of file diff --git a/templates/web/fixmystreet/report/new/notes.html b/templates/web/fixmystreet/report/new/notes.html index 36b6bfbbd..5a885abd0 100644 --- a/templates/web/fixmystreet/report/new/notes.html +++ b/templates/web/fixmystreet/report/new/notes.html @@ -1,6 +1,6 @@ <p>[% loc("Please note:") %]</p> -<ul> +<ul class="plain-list"> <li>[% loc("We will only use your personal information in accordance with our <a href=\"/faq#privacy\">privacy policy.</a>") %]</li> <li>[% loc("Please be polite, concise and to the point.") %]</li> <li>[% loc("Please do not be abusive — abusing your council devalues the service for all users.") %]</li> diff --git a/web/cobrands/fixmystreet/base.scss b/web/cobrands/fixmystreet/base.scss index 0b59b7cdb..db0d94404 100644 --- a/web/cobrands/fixmystreet/base.scss +++ b/web/cobrands/fixmystreet/base.scss @@ -187,16 +187,14 @@ select, input, textarea { /* LINKS */ -a { +a, +a:visited { text-decoration:none; color:$contrast1; &:hover, &:active { - text-decoration:underline; - color:$contrast2; - } - &:visited { - color: $colour_dark; + text-decoration:underline; + color:$contrast2; } } @@ -407,6 +405,13 @@ input.red-btn{ /*OTHER*/ +.plain-list { + @include list-reset-soft; + li { + margin-bottom:1em; + } +} + .issue-list{ margin: 0 0 1em 0; padding: 0px; diff --git a/web/cobrands/fixmystreet/config.rb b/web/cobrands/fixmystreet/config.rb index 74d54cc2e..471b4b008 100644 --- a/web/cobrands/fixmystreet/config.rb +++ b/web/cobrands/fixmystreet/config.rb @@ -16,9 +16,10 @@ javascripts_dir = "" # To disable debugging comments that display the original location of your selectors. Uncomment: # line_comments = false - # If you prefer the indented syntax, you might want to regenerate this # project again passing --syntax sass, or you can uncomment this: # preferred_syntax = :sass # and then run: # sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass + +line_comments = false # by Compass.app
\ No newline at end of file diff --git a/web/cobrands/fixmystreet/layout.scss b/web/cobrands/fixmystreet/layout.scss index bcb4fa84a..e9b87062b 100644 --- a/web/cobrands/fixmystreet/layout.scss +++ b/web/cobrands/fixmystreet/layout.scss @@ -158,7 +158,7 @@ } } -// Wraps around #key-tools to bo +// Wraps around #key-tools box .shadow-wrap{ position:fixed; bottom: 0em; @@ -201,6 +201,34 @@ textarea{ } +/* Report a problem page*/ +.report-a-poblem-page { + width: 41.25em; + #map_box { + width:15em; + } + #report-a-poblem-main { + width: 27em; + } + #report-a-poblem-sidebar { + position:absolute; + left:29em; + top:0; + width:15em; + .sidebar-tips { + background:#eeeeee; + padding:1em; + font-size:0.75em; + } + .sidebar-notes { + background:#333333; + padding:1em; + color:#ffffff; + font-size:0.75em; + } + } +} + /* MEDIA QUERIES */ @media only screen and (min-width: 640px) and (max-width: 960px) { diff --git a/web/js/fixmystreet.js b/web/js/fixmystreet.js index c3de39b48..1ebff1f4c 100644 --- a/web/js/fixmystreet.js +++ b/web/js/fixmystreet.js @@ -193,5 +193,13 @@ $(function(){ }); } + /* + * Report a problem page + */ + //desktop + if($('#report-a-poblem-sidebar:visible').length > 0){ + $('.content[role=main]').addClass('report-a-poblem-page'); + } + //hide on mobile $('.mobile #report-a-poblem-sidebar').hide(); });
\ No newline at end of file diff --git a/web/js/map-OpenLayers.js b/web/js/map-OpenLayers.js index fa93c2f4c..14c00efb3 100644 --- a/web/js/map-OpenLayers.js +++ b/web/js/map-OpenLayers.js @@ -216,6 +216,7 @@ $(function(){ $('#side-form').hide(); $('#side').show(); $('#sub_map_links').show(); + $('.content[role=main]').addClass('report-a-poblem-page'); fixmystreet.page = 'around'; }); @@ -371,6 +372,7 @@ OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, { } $('#side').hide(); $('#sub_map_links').hide(); + $('.content[role=main]').addClass('report-a-poblem-page'); fixmystreet.page = 'new'; location.hash = 'report'; } |