diff options
23 files changed, 78 insertions, 126 deletions
diff --git a/t/cobrand/form_extras/templates/report/new/after_photo.html b/t/cobrand/form_extras/templates/report/new/after_photo.html index b0c08ba20..89ab0b20c 100644 --- a/t/cobrand/form_extras/templates/report/new/after_photo.html +++ b/t/cobrand/form_extras/templates/report/new/after_photo.html @@ -2,11 +2,11 @@ [% IF field_errors.address %] <p class='form-error'>[% field_errors.address %]</p> [% END %] -<input type="text" value="[% report.get_extra_metadata('address') | html %]" name="address" id="form_address" required> +<input class="form-control" type="text" value="[% report.get_extra_metadata('address') | html %]" name="address" id="form_address" required> <label for="form_passport">Passport number (optional)</label> [% IF field_errors.passport %] <p class='form-error'>[% field_errors.passport %]</p> [% END %] -<input type="text" value="[% report.get_extra_metadata('passport') | html %]" name="passport" id="form_passport"> +<input class="form-control" type="text" value="[% report.get_extra_metadata('passport') | html %]" name="passport" id="form_passport"> diff --git a/templates/web/base/alert/_list.html b/templates/web/base/alert/_list.html index f94ce84f8..388e0e9bc 100644 --- a/templates/web/base/alert/_list.html +++ b/templates/web/base/alert/_list.html @@ -88,7 +88,7 @@ for the county council.', "%s is the site name"), site_name) %] [% UNLESS c.user_exists %] <label for="rznvy">[% loc('Your email') %]</label> - <input type="text" id="rznvy" name="rznvy" value="[% rznvy | html %]"> + <input class="form-control" type="text" id="rznvy" name="rznvy" value="[% rznvy | html %]"> [% END %] <input id="alert_email_button" style="margin-top:1em;" class="green-btn" type="submit" name="alert" value="[% loc('Subscribe me to an email alert') %]"> diff --git a/templates/web/base/alert/index.html b/templates/web/base/alert/index.html index 4965a1103..5c61e93d9 100644 --- a/templates/web/base/alert/index.html +++ b/templates/web/base/alert/index.html @@ -30,7 +30,7 @@ within a certain distance of a particular location.', "%s is the site name"), si <form method="get" action="/alert/list" class="form-box"> <fieldset> <div class="form-txt-submit-box"> - <input type="text" name="pc" value="[% pc | html %]" placeholder="[% tprintf(loc('e.g. ‘%s’ or ‘%s’'), c.cobrand.example_places) %]"> + <input class="form-control" type="text" name="pc" value="[% pc | html %]" placeholder="[% tprintf(loc('e.g. ‘%s’ or ‘%s’'), c.cobrand.example_places) %]"> <input class="green-btn" type="submit" value="[% loc('Go') %]"> </div> </fieldset> diff --git a/templates/web/base/alert/updates.html b/templates/web/base/alert/updates.html index ecaed37ca..82e99d49a 100644 --- a/templates/web/base/alert/updates.html +++ b/templates/web/base/alert/updates.html @@ -19,7 +19,7 @@ <label class="hidden n" for="alert_rznvy">[% loc('Your email') %]</label> <div class="form-txt-submit-box"> - <input type="email" name="rznvy" id="alert_rznvy" value="[% email | html %]" placeholder="[% loc('Your email') %]"> + <input class="form-control" type="email" name="rznvy" id="alert_rznvy" value="[% email | html %]" placeholder="[% loc('Your email') %]"> <input class="green-btn" type="submit" value="[% loc('Subscribe') %]"> </div> diff --git a/templates/web/base/auth/change_email.html b/templates/web/base/auth/change_email.html index 58c864929..471782e42 100644 --- a/templates/web/base/auth/change_email.html +++ b/templates/web/base/auth/change_email.html @@ -24,7 +24,7 @@ <div class="form-field"> <label for="email">[% loc('New email address:') %]</label> - <input type="email" name="email" id="email" value="[% email | html %]"> + <input class="form-control" type="email" name="email" id="email" value="[% email | html %]"> </div> <div class="final-submit"> <input type="submit" value="[% loc('Change email address') %]"> diff --git a/templates/web/base/auth/change_password.html b/templates/web/base/auth/change_password.html index 80708abb1..50ecc93a2 100644 --- a/templates/web/base/auth/change_password.html +++ b/templates/web/base/auth/change_password.html @@ -17,7 +17,7 @@ INCLUDE 'header.html', title = loc('Change password'), bodyclass = bclass <form action="[% c.uri_for('change_password') %]" method="post" name="change_password" class="fieldset"> <input type="hidden" name="token" value="[% csrf_token %]"> - + <fieldset> [% IF password_error; @@ -26,18 +26,18 @@ INCLUDE 'header.html', title = loc('Change password'), bodyclass = bclass mismatch => loc('The passwords do not match'), other => loc('Please check the passwords and try again'), }; - + loc_password_error = errors.$password_error || errors.other; %] <div class="form-error">[% loc_password_error %]</div> [% END %] <div class="form-field"> <label for="new_password">[% loc('New password:') %]</label> - <input type="password" name="new_password" value="[% new_password | html %]"> + <input class="form-control" type="password" name="new_password" value="[% new_password | html %]"> </div> <div class="form-field"> <label for="confirm">[% loc('Again:') %]</label> - <input type="password" name="confirm" value="[% confirm | html %]"> + <input class="form-control" type="password" name="confirm" value="[% confirm | html %]"> </div> <div class="final-submit"> <input type="submit" value="[% loc('Change password') %]"> diff --git a/templates/web/base/auth/general.html b/templates/web/base/auth/general.html index a8bf8f1e0..cf539ff4f 100644 --- a/templates/web/base/auth/general.html +++ b/templates/web/base/auth/general.html @@ -52,7 +52,7 @@ [% ELSIF sign_in_error %] <div class="form-error">[% loc('There was a problem with your email/password combination. If you cannot remember your password, or do not have one, please fill in the ‘sign in by email’ section of the form.') %]</div> [% END %] - <input type="email" class="required email" id="email" name="email" value="[% email | html %]" placeholder="[% loc('Your email address') %]" autofocus> + <input type="email" class="form-control required email" id="email" name="email" value="[% email | html %]" placeholder="[% loc('Your email address') %]" autofocus> <div id="form_sign_in"> <h3>[% tprintf(loc("Do you have a %s password?", "%s is the site name"), site_name) %]</h3> @@ -82,7 +82,7 @@ <label class="hidden-js n" for="password_sign_in">[% loc('Password:') %]</label> <div class="form-txt-submit-box"> - <input type="password" name="password_sign_in" id="password_sign_in" value="" placeholder="[% loc('Your password') %]"> + <input type="password" name="password_sign_in" class="form-control" id="password_sign_in" value="" placeholder="[% loc('Your password') %]"> <input class="green-btn" type="submit" name="sign_in" value="[% loc('Sign in') %]"> </div> @@ -104,7 +104,7 @@ <h5>[% loc('<strong>No</strong> let me sign in by email') %]</h5> <label for="name">[% loc('Name') %]</label> - <input type="text" name="name" value="" placeholder="[% loc('Your name') %]"> + <input class="form-control" type="text" name="name" value="" placeholder="[% loc('Your name') %]"> <label for="password_register">[% loc('Password (optional)') %]</label> @@ -113,7 +113,7 @@ </div> <div class="form-txt-submit-box"> - <input type="password" name="password_register" id="password_register" value="" placeholder="[% loc('Enter a password') %]"> + <input class="form-control" type="password" name="password_register" id="password_register" value="" placeholder="[% loc('Enter a password') %]"> <input class="green-btn" type="submit" name="email_sign_in" value="[% loc('Sign in') %]"> </div> </div> diff --git a/templates/web/base/contact/index.html b/templates/web/base/contact/index.html index 86a0cec0d..536b95527 100644 --- a/templates/web/base/contact/index.html +++ b/templates/web/base/contact/index.html @@ -11,7 +11,7 @@ [% ELSE %] <h1>[% loc('Contact the team') %]</h1> [% END %] - + <form method="post" action="/contact/submit" class="validate"> <fieldset> [% INCLUDE 'errors.html' %] @@ -77,21 +77,21 @@ [% IF field_errors.name %] <div class="form-error">[% field_errors.name %]</div> [% END %] - <input type="text" class="required" name="name" id="form_name" value="[% form_name | html %]" size="30"> + <input type="text" class="form-control required" name="name" id="form_name" value="[% form_name | html %]" size="30"> <label for="form_email">[% loc('Your email') %]</label> [% IF field_errors.em %] <div class="form-error">[% field_errors.em %]</div> [% END %] - <input type="text" class="required email" name="em" id="form_email" value="[% em | html %]" size="30"> + <input type="text" class="form-control required email" name="em" id="form_email" value="[% em | html %]" size="30"> <label for="form_subject">[% loc('Subject') %]</label> [% IF field_errors.subject %] <div class="form-error">[% field_errors.subject %]</div> [% END %] - <input type="text" class="required" name="subject" id="form_subject" value="[% subject | html %]" size="30"> + <input type="text" class="form-control required" name="subject" id="form_subject" value="[% subject | html %]" size="30"> [% INCLUDE 'contact/who.html' %] @@ -99,7 +99,7 @@ [% IF field_errors.message %] <div class="form-error">[% field_errors.message %]</div> [% END %] - <textarea class="required" name="message" id="form_message" rows="7" cols="50">[% message | html %]</textarea> + <textarea class="form-control required" name="message" id="form_message" rows="7" cols="50">[% message | html %]</textarea> <input class="final-submit green-btn" type="submit" value="[% loc('Post') %]"> diff --git a/templates/web/base/questionnaire/index.html b/templates/web/base/questionnaire/index.html index 52d5ed5b1..a93039827 100644 --- a/templates/web/base/questionnaire/index.html +++ b/templates/web/base/questionnaire/index.html @@ -70,7 +70,7 @@ <p>[% loc('If you wish to leave a public update on the problem, please enter it here (please note it will not be sent to the council).') %]</p> -<p><textarea name="update" rows="7" cols="30" placeholder="[% loc('What was your experience of getting the problem fixed?') %]">[% update | html %]</textarea></p> +<p><textarea class="form-control" name="update" rows="7" cols="30" placeholder="[% loc('What was your experience of getting the problem fixed?') %]">[% update | html %]</textarea></p> [% IF c.cobrand.allow_photo_upload %] <input type="hidden" name="upload_fileid" value="[% upload_fileid %]"> diff --git a/templates/web/base/report/new/category.html b/templates/web/base/report/new/category.html index ba6347d39..65bc485ab 100644 --- a/templates/web/base/report/new/category.html +++ b/templates/web/base/report/new/category.html @@ -5,7 +5,7 @@ <label for='form_category' id="form_category_label"> [%~ loc('Category') ~%] </label>[% =%] - <select name='category' id='form_category'> + <select class="form-control" name='category' id='form_category'> [%~ FOREACH cat_op IN category_options ~%] [% cat_op_lc = cat_op | lower =%] <option value='[% cat_op | html %]'[% ' selected' IF report.category == cat_op || category == cat_op_lc || (category_options.size == 2 AND loop.last) ~%] diff --git a/templates/web/base/report/new/category_extras.html b/templates/web/base/report/new/category_extras.html index 4d009f1ac..47d6b84e6 100644 --- a/templates/web/base/report/new/category_extras.html +++ b/templates/web/base/report/new/category_extras.html @@ -16,13 +16,13 @@ [% END -%] [% IF meta.variable != 'false' %] [% IF meta.exists('values') %] - <select name="[% meta_name %]" id="form_[% meta_name %]"[% meta.required == 'true' ? ' required' : '' %]> + <select class="form-control" name="[% meta_name %]" id="form_[% meta_name %]"[% meta.required == 'true' ? ' required' : '' %]> [% FOR option IN meta.values %] <option value="[% option.key %]"[% IF option.key == report_meta.$meta_name.value %] selected[% END %]>[% option.name %]</option> [% END %] </select> [% ELSE %] - <input type="text" value="[% report_meta.$meta_name.value | html %]" name="[% meta_name %]" id="form_[% meta_name %]"[% meta.required == 'true' ? ' required' : '' %]> + <input class="form-control" type="text" value="[% report_meta.$meta_name.value | html %]" name="[% meta_name %]" id="form_[% meta_name %]"[% meta.required == 'true' ? ' required' : '' %]> [% END %] [% END %] [%- END %] diff --git a/templates/web/base/report/new/category_wrapper.html b/templates/web/base/report/new/category_wrapper.html index f6bb618f0..85b085999 100644 --- a/templates/web/base/report/new/category_wrapper.html +++ b/templates/web/base/report/new/category_wrapper.html @@ -1,7 +1,7 @@ [% 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> + <select class="form-control" name="category" id="form_category" required><option>[% loc('Loading...') %]</option></select> </div> [% ELSE %] [% IF category_options.size %] diff --git a/templates/web/base/report/new/form_report.html b/templates/web/base/report/new/form_report.html index 72d912f85..dfa4a0b47 100644 --- a/templates/web/base/report/new/form_report.html +++ b/templates/web/base/report/new/form_report.html @@ -11,7 +11,7 @@ [% 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('10 inch pothole on Example St, near post box') %]" required> + <input class="form-control" type="text" value="[% report.title | html %]" name="title" id="form_title" placeholder="[% loc('10 inch pothole on Example St, near post box') %]" required> [% IF c.cobrand.allow_photo_upload %] <input type="hidden" name="upload_fileid" value="[% upload_fileid %]"> @@ -44,7 +44,7 @@ [% 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('This pothole has been here for two months and…') %]" required>[% report.detail | html %]</textarea> + <textarea class="form-control" rows="7" cols="26" name="detail" id="form_detail" placeholder="[% loc('This pothole has been here for two months and…') %]" required>[% report.detail | html %]</textarea> [% TRY %][% PROCESS 'report/new/inline-tips.html' %][% CATCH file %][% END %] diff --git a/templates/web/base/report/new/form_user_loggedin.html b/templates/web/base/report/new/form_user_loggedin.html index 0d0ceb11c..4935a6481 100644 --- a/templates/web/base/report/new/form_user_loggedin.html +++ b/templates/web/base/report/new/form_user_loggedin.html @@ -14,7 +14,7 @@ [% BLOCK form_as %] <label for="form_as">[% loc('Report as') %]</label> - <select id="form_as" class="js-contribute-as" name="form_as"> + <select id="form_as" class="form-control js-contribute-as" name="form_as"> <option value="myself" selected>[% loc('Yourself') %]</option> [% IF js || can_contribute_as_another_user %] <option value="another_user">[% loc('Another user') %]</option> @@ -26,7 +26,7 @@ [% END %] <label for="form_email">[% loc('Email address') %]</label> - <input id="form_email" + <input class="form-control" id="form_email" [%- IF js OR can_contribute_as_another_user OR can_contribute_as_body -%] name="email" [%- ELSE -%] @@ -46,7 +46,7 @@ [% IF field_errors.name %] <p class='form-error'>[% field_errors.name %]</p> [% END %] - <input type="text" class="validName js-form-name" value="[% report.name | html %]" name="name" id="form_name"> + <input type="text" class="form-control validName js-form-name" 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 %] <div class="checkbox-group"> @@ -55,7 +55,7 @@ </div> <label for="form_phone">[% loc('Phone number (optional)') %]</label> - <input class="" type="text" value="[% report.user.phone | html %]" name="phone" id="form_phone"> + <input class="form-control" type="text" value="[% report.user.phone | html %]" name="phone" id="form_phone"> <div class="form-txt-submit-box"> <input class="green-btn js-submit_register" type="submit" name="submit_register" value="[% loc('Submit') %]"> diff --git a/templates/web/base/report/new/form_user_loggedout_by_email.html b/templates/web/base/report/new/form_user_loggedout_by_email.html index 87df57b00..409fd4bbf 100644 --- a/templates/web/base/report/new/form_user_loggedout_by_email.html +++ b/templates/web/base/report/new/form_user_loggedout_by_email.html @@ -14,7 +14,7 @@ <p class='form-error'>[% field_errors.name %]</p> [% END %] - <input type="text" class="form-focus-trigger validName js-form-name" value="[% report.name | html %]" name="name" id="form_name" placeholder="[% loc('Your name') %]"> + <input type="text" class="form-control form-focus-trigger validName js-form-name" value="[% report.name | html %]" name="name" id="form_name" placeholder="[% loc('Your name') %]"> [%# if there is nothing in the name field then set check box as default on form %] <div class="checkbox-group"> @@ -23,7 +23,7 @@ </div> <label class="form-focus-hidden" for="form_phone">[% loc('Phone number (optional)') %]</label> - <input class="form-focus-hidden" type="text" value="[% report.user.phone | html %]" name="phone" id="form_phone" placeholder="[% loc('Your phone number') %]"> + <input class="form-control form-focus-hidden" type="text" value="[% report.user.phone | html %]" name="phone" id="form_phone" placeholder="[% loc('Your phone number') %]"> <label class="form-focus-hidden" for="password_register">[% loc('Password (optional)') %]</label> @@ -32,7 +32,7 @@ </div> <div class="form-txt-submit-box form-focus-hidden"> - <input type="password" name="password_register" id="password_register" value="" placeholder="[% loc('Enter a password') %]"> + <input class="form-control" type="password" name="password_register" id="password_register" value="" placeholder="[% loc('Enter a password') %]"> <input class="green-btn js-submit_register" type="submit" name="submit_register" value="[% loc('Submit') %]"> </div> </div> diff --git a/templates/web/base/report/new/form_user_loggedout_email.html b/templates/web/base/report/new/form_user_loggedout_email.html index e117bc275..39e9fd779 100644 --- a/templates/web/base/report/new/form_user_loggedout_email.html +++ b/templates/web/base/report/new/form_user_loggedout_email.html @@ -2,6 +2,6 @@ [% IF field_errors.email %] <p class='form-error'>[% field_errors.email %]</p> [% END %] -<input type="email" value="[% report.user.email | html %]" name="email" id="form_email" placeholder="[% loc('Please enter your email address') %]" +<input class="form-control" type="email" value="[% report.user.email | html %]" name="email" id="form_email" placeholder="[% loc('Please enter your email address') %]" [% IF required %]required[% END %] class="required"> diff --git a/templates/web/base/report/new/form_user_loggedout_password.html b/templates/web/base/report/new/form_user_loggedout_password.html index 0f234aeba..a4d1aefe0 100644 --- a/templates/web/base/report/new/form_user_loggedout_password.html +++ b/templates/web/base/report/new/form_user_loggedout_password.html @@ -7,7 +7,7 @@ <p class='form-error'>[% field_errors.password %]</p> [% END %] <div class="form-txt-submit-box"> - <input type="password" name="password_sign_in" id="password_sign_in" placeholder="[% loc('Your password') %]" value=""> + <input class="form-control" type="password" name="password_sign_in" id="password_sign_in" placeholder="[% loc('Your password') %]" value=""> <input class="green-btn js-submit_sign_in" type="submit" name="submit_sign_in" value="[% loc('Submit') %]"> </div> diff --git a/templates/web/base/report/update/form_name.html b/templates/web/base/report/update/form_name.html index ef8efd296..5d4c719ae 100644 --- a/templates/web/base/report/update/form_name.html +++ b/templates/web/base/report/update/form_name.html @@ -17,7 +17,7 @@ [% END %] </select> <label for="form_email">[% loc('Email address') %]</label> - <input name="rznvy" id="form_email" type="text" value="[% c.user.email | html %]"> + <input class="form-control" name="rznvy" id="form_email" type="text" value="[% c.user.email | html %]"> [% END %] <label for="form_name">[% loc('Name') %]</label> @@ -25,7 +25,7 @@ <p class='form-error'>[% field_errors.name %]</p> [% END %] -<input type="text" class="validName js-form-name" +<input type="text" class="form-control validName js-form-name" name="name" id="form_name" value="[% update.name || c.user.name | html %]" placeholder="[% loc('Your name') %]"> <div class="checkbox-group"> diff --git a/templates/web/zurich/report/new/fill_in_details_form.html b/templates/web/zurich/report/new/fill_in_details_form.html index 9158fa090..77d764950 100644 --- a/templates/web/zurich/report/new/fill_in_details_form.html +++ b/templates/web/zurich/report/new/fill_in_details_form.html @@ -46,7 +46,7 @@ [% 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> + <textarea class="form-control" rows="7" cols="26" name="detail" id="form_detail" placeholder="[% loc('Please fill in details of the problem.') %]" required>[% report.detail | html %]</textarea> [% PROCESS "report/new/category_wrapper.html" %] @@ -54,19 +54,19 @@ [% IF field_errors.email %] <p class='form-error'>[% field_errors.email %]</p> [% END %] - <input type="email" value="[% report.user.email | html %]" name="email" id="form_email" placeholder="[% loc('Please enter your email address') %]" required> + <input class="form-control" type="email" value="[% report.user.email | html %]" name="email" id="form_email" placeholder="[% loc('Please enter your email address') %]" required> <label for="form_name">[% loc('Name') %] [% loc('(optional)') %]</label> [% IF field_errors.name %] <p class='form-error'>[% field_errors.name %]</p> [% END %] - <input class="js-form-name" type="text" value="[% report.name | html %]" name="name" id="form_name" placeholder="[% loc('Your name') %]"> + <input class="form-control js-form-name" type="text" value="[% report.name | html %]" name="name" id="form_name" placeholder="[% loc('Your name') %]"> <label for="form_phone">[% loc('Phone number') %]</label> [% IF field_errors.phone %] <p class='form-error'>[% field_errors.phone %]</p> [% END %] - <input type="text" value="[% report.user.phone | html %]" name="phone" id="form_phone" placeholder="[% loc('Your phone number') %]" required> + <input class="form-control" type="text" value="[% report.user.phone | html %]" name="phone" id="form_phone" placeholder="[% loc('Your phone number') %]" required> <div class="form-txt-submit-box"> [%# class of submit_sign_in so name can be optional, name of submit_register so it doesn't try and sign us in %] diff --git a/web/cobrands/hart/hart.scss b/web/cobrands/hart/hart.scss index 737dab4e9..37a48badf 100644 --- a/web/cobrands/hart/hart.scss +++ b/web/cobrands/hart/hart.scss @@ -7,15 +7,6 @@ @import "../sass/mixins"; @import "_colours"; -// Taken from Bromley's form css -input[type=text], -input[type=password], -input[type=email], -input[type=file], -textarea, -select { background: #fff; border: 1px solid #768b9a; border-color: #768b9a #d1dee8 #d1dee8 #768b9a; color: #333; font-family: "Gill Sans MT", "Gill Sans", Arial, 'Helvetica Neue', Helvetica, sans-serif; padding: 8px; -@include border-radius(0); } - .green-btn, button.green-btn, input.green-btn { background: #5b7189; border: 1px solid #8e9eb0; @@ -30,9 +21,6 @@ select { background: #fff; border: 1px solid #768b9a; border-color: #768b9a #d1d .green-btn:hover, button.green-btn:hover, input.green-btn:hover { background: #5b7189; border: 1px solid #8e9eb0; } -.form-txt-submit-box input[type=submit] { - padding-top: 0; padding-bottom: 0; width: auto; -} h1, h2, h3, h4, h5, h6, legend { font-family: 'Gill Sans MT', 'Gill Sans', 'Trebuchet MS', Calibri, sans-serif; } diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss index 7bc4e0210..eb7708218 100644 --- a/web/cobrands/sass/_base.scss +++ b/web/cobrands/sass/_base.scss @@ -10,6 +10,8 @@ $itemlist_item_background: #f6f6f6 !default; $itemlist_item_background_hover: #e6e6e6 !default; $col_big_numbers: #ccc !default; +$form-control-border-color: #aaaaaa; + @import "_mixins"; @import "_report_list"; @@ -222,38 +224,6 @@ h4.static-with-rule{ /* FORMS */ -// input placeholders, these need to be on separate lines as if the browser -// can't understand a selector it will invalidate the whole line. -::-webkit-input-placeholder { - color: #666666; - font: { - style:italic; - size:0.9375em; - } -} -:-moz-placeholder { - color:#666666; - font: { - style:italic; - size:0.9375em; - } -} -:-ms-placeholder { - color:#666666; - font: { - style:italic; - size:0.9375em; - } -} -//this only gets used when the browser doesn't support @placeholder -.placeholder { - color:#666666; - font: { - style:italic; - size:0.9375em; - } -} - input[type=file] { width: 100%; } @@ -263,42 +233,20 @@ input[type=password], input[type=email], textarea { @include box-sizing(border-box); + display: block; width: 100%; - // adjust so the sides line up padding: 0.5em; -} -.ie7 { - input[type=text], - input[type=password], - input[type=email], - textarea { - max-width: 95%; - } -} - -textarea { - border: 0.125em solid #888888; - @include border-radius(0.25em); - display: block; - font-size: 1em; - line-height: 1.5em; - font-family: $meta-font; - min-height:8em; -} - -input[type=text], -input[type=password], -input[type=email] { - border: 0.125em solid #888888; - @include border-radius(0.25em); - display: block; font-size: 1em; line-height: 1em; + + .ie7 & { + max-width: 95%; + } } -input[readonly] { - border-color: #cccccc; - color: #888888; +textarea { + line-height: 1.5em; + min-height: 8em; } label{ @@ -317,6 +265,25 @@ label{ } } +.form-control { + display: block; + background-color: #fff; + border: 1px solid $form-control-border-color; + @include border-radius(4px); + box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2); + font-family: inherit; // eg: stop Firefox and IE10-11 using Courier in textareas + + &[readonly] { + box-shadow: none; + color: #888888; + } +} + +select.form-control { + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); + height: 2.2em; // roughly equal to default input height +} + // grey background, full width box .form-box { margin: 0 -1em 0.25em; @@ -387,8 +354,8 @@ label{ float: $right; width:28%; margin-#{$right}: 0.25em; - padding-top:0.7em; - padding-bottom:0.6em; + padding-top:0.6em; + padding-bottom:0.5em; } } diff --git a/web/cobrands/sass/_dropzone.scss b/web/cobrands/sass/_dropzone.scss index 3e5fc8058..432f7f6b4 100644 --- a/web/cobrands/sass/_dropzone.scss +++ b/web/cobrands/sass/_dropzone.scss @@ -1,18 +1,15 @@ $dropzone-link-color: #0BA7D1; // match default `a` styling $dropzone-link-color--awakened: #0D7CCE; // match default `a:hover` styling -$dropzone-border-color: #888; // match default form inputs $dropzone-border-color--awakened: $dropzone-link-color--awakened; $dropzone-border-color--full: #bf002a; -$dropzone-border-radius: 0.25em; // match default form inputs $dropzone-background-color: #fff; $dropzone-background-color--awakened: mix($dropzone-link-color, $dropzone-background-color, 10%); $dropzone-background-color--full: mix($dropzone-border-color--full, $dropzone-background-color, 10%); .dropzone { + @extend .form-control; @include clearfix; - border: 0.125em solid $dropzone-border-color; background-color: $dropzone-background-color; - border-radius: $dropzone-border-radius; padding: 1.5em; text-align: center; } @@ -55,7 +52,7 @@ $dropzone-background-color--full: mix($dropzone-border-color--full, $dropzone-ba cursor: auto; &:hover { - border-color: $dropzone-border-color; + border-color: $form-control-border-color; background-color: $dropzone-background-color; .dz-remove, @@ -111,7 +108,7 @@ $dropzone-background-color--full: mix($dropzone-border-color--full, $dropzone-ba right: 0; bottom: 0; - border-radius: $dropzone-border-radius; + border-radius: 4px; overflow: hidden; // crop child image to border radius, even before img src has loaded img { @@ -144,7 +141,7 @@ $dropzone-background-color--full: mix($dropzone-border-color--full, $dropzone-ba .dz-upload { background: rgba(0,0,0,0.2); - border-radius: $dropzone-border-radius; + border-radius: 4px; height: 100%; width: 0; display: block; diff --git a/web/cobrands/sass/_h5bp.scss b/web/cobrands/sass/_h5bp.scss index b41effa1b..9b1c56ab5 100644 --- a/web/cobrands/sass/_h5bp.scss +++ b/web/cobrands/sass/_h5bp.scss @@ -37,8 +37,8 @@ html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 10 body { margin: 0; font-size: 1em; line-height: 1.5; } /* mySociety addition: background colour */ -body, button, input, select, textarea { - font-family: sans-serif; +body, button { + font-family: sans-serif; color: #222; background-color: #fff } |