From f06fbc2b2bdbcb89e37d54b1b206b6ae46a6ae3f Mon Sep 17 00:00:00 2001
From: Charles Shin <charles@openroad.ca>
Date: Tue, 21 Feb 2017 16:59:57 -0800
Subject: [PATCH] Updated new style for checkbox and textbox

---
 .../apps/core/templates/f1/01_orders.html     | 18 +++++++-------
 .../apps/core/templates/f1/02_claimant.html   |  8 +++----
 .../apps/core/templates/f1/03_respondent.html |  8 +++----
 .../apps/core/templates/f1/04_marriage.html   |  6 ++---
 .../apps/core/templates/f1/10_location.html   | 24 +++++++++----------
 edivorce/apps/core/templates/pdf/form35.html  | 16 ++++++-------
 edivorce/apps/core/templates/pdf/form52.html  |  4 ++--
 .../templates/prequalification/step_04.html   | 10 ++++----
 8 files changed, 48 insertions(+), 46 deletions(-)

diff --git a/edivorce/apps/core/templates/f1/01_orders.html b/edivorce/apps/core/templates/f1/01_orders.html
index 339014e8..4487e186 100644
--- a/edivorce/apps/core/templates/f1/01_orders.html
+++ b/edivorce/apps/core/templates/f1/01_orders.html
@@ -18,10 +18,12 @@
                 <p><em>With an undefended divorce (aka desk order), you do not need  to appear in court. However a judge needs to review and approve what you are asking for.  Orders allow you to tell the court what you want (for example parenting support and property division).</em></p>
                 <p><em>Please select what you are asking for. Later on you will be asked to provide details for each request.</em></p>
                 <div class="checkbox-group">
-                    <div class="radio">
-                        <label>
-                            {% input_option type="checkbox" name="want_which_orders" value="A legal end to the marriage" %}<b>A legal end to the marriage</b>
-                        </label>
+                    <div>
+                        <div class="checkbox">
+                            <label>
+                                {% input_option type="checkbox" name="want_which_orders" value="A legal end to the marriage" %}<b>A legal end to the marriage</b>
+                            </label>
+                        </div>
                         <p>
                             Divorce is the end of a legal marriage. To get a divorce, you must go through a legal process and get a court order that says the marriage has ended.
                         </p>
@@ -53,7 +55,7 @@
                             </div>
                         </div>
                     </div>
-                    <div class="radio"><label>{% input_option type="checkbox" name="want_which_orders" value="Spousal support" data_target_id="spouse_support_alert" data_reveal_target="true" %}<b>Spousal support</b></label>
+                    <div><div class="checkbox"><label>{% input_option type="checkbox" name="want_which_orders" value="Spousal support" data_target_id="spouse_support_alert" data_reveal_target="true" %}<b>Spousal support</b></label></div>
                         <p><em>Payments to support you, not the children.</em></p>
                         <p><em>For more information, please see the fact sheet Spousal Support
                             <i class="fa fa-question-circle" data-toggle="tooltip" data-placement="right" data-html="true"
@@ -78,7 +80,7 @@
                             <p>If you were unmarried, and you qualify for spousal support, you must apply within two years of the date you separated.</p>
                         </div>
                     </div>
-                    <div class="radio"><label>{% input_option type="checkbox" name="want_which_orders" value="Division of property and debts" data_target_id="property_division_alert" data_reveal_target="true" %}<b>Division of property and debts</b></label>
+                    <div><div class="checkbox"><label>{% input_option type="checkbox" name="want_which_orders" value="Division of property and debts" data_target_id="property_division_alert" data_reveal_target="true" %}<b>Division of property and debts</b></label></div>
                         <p><em>Anything you own including real estate, bank accounts, cars and RRSPs.</em></p>
                         <p><em>For more information, please refer to  the following fact sheets on the  Legal Services Society website:</em></p>
                         <ul>
@@ -100,10 +102,10 @@
                                 </ul>
                         </div>
                     </div>
-                    <div class="radio"><label>{% input_option type="checkbox" name="want_which_orders" value="Other orders" %}<b>Other orders</b></label>
+                    <div><div class="checkbox"><label>{% input_option type="checkbox" name="want_which_orders" value="Other orders" %}<b>Other orders</b></label></div>
                         <p><em>For example, a name change.</em></p>
                     </div>
-                    <div class="radio"><label>{% input_option type="checkbox" name="want_which_orders" value="Child support" data_target_id="child_support_alert" data_reveal_target="true" %}<b>Child support (Out of scope)</b></label>
+                    <div><div class="checkbox"><label>{% input_option type="checkbox" name="want_which_orders" value="Child support" data_target_id="child_support_alert" data_reveal_target="true" %}<b>Child support (Out of scope)</b></label></div>
                         <div class="information-message bg-danger" id="child_support_alert" hidden>
                             <p>We've noticed that at this point in time you are not applying for spousal support and/or division of property, debt, or a pension. If you decide to request these items in the future there are some time limits.</p>
                             <h2>Division of Property and Debts</h2>
diff --git a/edivorce/apps/core/templates/f1/02_claimant.html b/edivorce/apps/core/templates/f1/02_claimant.html
index ae594326..30775fe4 100644
--- a/edivorce/apps/core/templates/f1/02_claimant.html
+++ b/edivorce/apps/core/templates/f1/02_claimant.html
@@ -13,7 +13,7 @@
 
                 <div>
                     <h3>Please enter your name as it appears on the marriage certificate</h3>
-                    {% input_option type="text" name="name_you" class="response-textbox" %}
+                    {% input_option type="text" name="name_you" class="form-block input-wide response-textbox" %}
 
                     <div class="collapse-trigger collapsed" data-toggle="collapse" aria-expanded="false" data-target="#collapse_changed_name" aria-controls="collapse_changed_name">
                         <div>
@@ -79,20 +79,20 @@
 
                     <div id="enter_name" hidden>
                         <h3>Please enter the name</h3>
-                        {% input_option type="text" name="other_name_you" class="response-textbox" %}
+                        {% input_option type="text" name="other_name_you" class="form-block input-wide response-textbox" %}
                         <input type="button" value="Add name"/>
                     </div>
                 </div>
 
                 <div>
                     <h3>What was your last name when you were born?</h3>
-                    {% input_option type="text" name="last_name_born_you" class="response-textbox" %}
+                    {% input_option type="text" name="last_name_born_you" class="form-block input-wide response-textbox" %}
                     <p>This is often referred to as Family name or Surname</p>
                 </div>
 
                 <div>
                     <h3>What was your last name before you were married?</h3>
-                    {% input_option type="text" name="last_name_before_married_you" class="response-textbox" %}
+                    {% input_option type="text" name="last_name_before_married_you" class="form-block input-wide response-textbox" %}
                     <p>This is often referred to as Family name or Surname</p>
                 </div>
             </div>
diff --git a/edivorce/apps/core/templates/f1/03_respondent.html b/edivorce/apps/core/templates/f1/03_respondent.html
index 82b2ad58..740c6cb9 100644
--- a/edivorce/apps/core/templates/f1/03_respondent.html
+++ b/edivorce/apps/core/templates/f1/03_respondent.html
@@ -12,7 +12,7 @@
 
                 <div>
                     <h3>Please enter your spouse's name as it appears on the marriage certificate</h3>
-                    {% input_option type="text" name="name_spouse" class="response-textbox" %}
+                    {% input_option type="text" name="name_spouse" class="form-block input-wide response-textbox" %}
                     <p>This is also know as surname or family name.</p>
 
                     <div class="collapse-trigger collapsed" data-toggle="collapse" aria-expanded="false"
@@ -80,7 +80,7 @@
 
                     <div id="enter_name" hidden>
                         <h3>Please enter the name</h3>
-                        {% input_option type="text" name="other_name_spouse" class="response-textbox" %}
+                        {% input_option type="text" name="other_name_spouse" class="form-block input-wide response-textbox" %}
                         <input type="button" value="Add name"/>
                     </div>
 
@@ -88,13 +88,13 @@
 
                 <div>
                     <h3>What was their last name when they were born?</h3>
-                    {% input_option type="text" name="last_name_born_spouse" class="response-textbox" %}
+                    {% input_option type="text" name="last_name_born_spouse" class="form-block input-wide response-textbox" %}
                     <p>This is often referred to as Family name or Surname</p>
                 </div>
 
                 <div>
                     <h3>What was their last name before you were married?</h3>
-                    {% input_option type="text" name="last_name_before_married_spouse" class="response-textbox" %}
+                    {% input_option type="text" name="last_name_before_married_spouse" class="form-block input-wide response-textbox" %}
                     <p>This is often referred to as Family name or Surname</p>
                 </div>
             </div>
diff --git a/edivorce/apps/core/templates/f1/04_marriage.html b/edivorce/apps/core/templates/f1/04_marriage.html
index 9d841d0b..bfbba7b9 100644
--- a/edivorce/apps/core/templates/f1/04_marriage.html
+++ b/edivorce/apps/core/templates/f1/04_marriage.html
@@ -74,14 +74,14 @@
                     <h3>Where were you married?</h3>
                     <p>Enter the location as it appears on the marriage certificate (e.g. city, province or state and country)</p>
                     <p>City</p>
-                    {% input_option type="text" name="where_were_you_married_city" class="response-textbox" %}
+                    {% input_option type="text" name="where_were_you_married_city" class="form-block input-wide response-textbox" %}
                     <p>Prov/State</p>
-                    {% input_option type="text" name="where_were_you_married_prov" class="response-textbox" %}
+                    {% input_option type="text" name="where_were_you_married_prov" class="form-block input-narrow response-textbox" %}
                     <p>Country</p>
 
                     <div class="radio"><label>{% input_option type="radio" class="radio-with-other" name="where_were_you_married_country" value="Canada" %}Canada</label></div>
                     <div class="radio"><label>{% input_option type="radio" class="radio-with-other" name="where_were_you_married_country" value="USA" %}USA</label></div>
-                    <div class="radio"><label>{% input_option type="radio" class="radio-with-other radio_with_textbox" name="where_were_you_married_country" value="Other" %}Other {% input_option type="text" name="where_were_you_married_other_country" class="response-textbox other-textbox" %}</label></div>
+                    <div class="radio"><label>{% input_option type="radio" class="radio-with-other radio_with_textbox" name="where_were_you_married_country" value="Other" %}Other {% input_option type="text" name="where_were_you_married_other_country" class="response-textbox other-textbox input-inline" %}</label></div>
                 </div>
 
                 <div>
diff --git a/edivorce/apps/core/templates/f1/10_location.html b/edivorce/apps/core/templates/f1/10_location.html
index 2caacfe1..81c5a98a 100644
--- a/edivorce/apps/core/templates/f1/10_location.html
+++ b/edivorce/apps/core/templates/f1/10_location.html
@@ -33,17 +33,17 @@
                         <h3>What is the best address to send you official court documents?</h3>
                         <p><em>This is known as your "address for service"</em></p>
                         <p><em>House and street number</em></p>
-                        {% input_option type="text" name="address_to_send_official_document_street_you" class="response-textbox" %}
+                        {% input_option type="text" name="address_to_send_official_document_street_you" class="form-block input-wide response-textbox" %}
                         <p><em>City</em></p>
-                        {% input_option type="text" name="address_to_send_official_document_city_you" class="response-textbox" %}
+                        {% input_option type="text" name="address_to_send_official_document_city_you" class="form-block input-wide response-textbox" %}
                         <p><em>Prov/State</em></p>
-                        {% input_option type="text" name="address_to_send_official_document_prov_you" class="response-textbox" %}
+                        {% input_option type="text" name="address_to_send_official_document_prov_you" class="form-block input-narrow response-textbox" %}
 
                         <p>Country</p>
 
                         <div class="radio"><label>{% input_option type="radio" class="radio-with-other" name="address_to_send_official_document_country_you" value="Canada" %}Canada</label></div>
                         <div class="radio"><label>{% input_option type="radio" class="radio-with-other" name="address_to_send_official_document_country_you" value="USA" %}USA</label></div>
-                        <div class="radio"><label>{% input_option type="radio" class="radio-with-other radio_with_textbox" name="address_to_send_official_document_country_you" value="Other" %}Other {% input_option type="text" name="address_to_send_official_document_other_country_you" class="response-textbox other-textbox" tabindex="-1" %}</label></div>
+                        <div class="radio"><label>{% input_option type="radio" class="radio-with-other radio_with_textbox" name="address_to_send_official_document_country_you" value="Other" %}Other {% input_option type="text" name="address_to_send_official_document_other_country_you" class="response-textbox other-textbox input-inline" tabindex="-1" %}</label></div>
                     </div>
 
                     <div>
@@ -52,9 +52,9 @@
                             an address that’s not a PO box.</em></p>
 
                         <p><em>Fax number (optional)</em></p>
-                        {% input_option type="text" name="address_to_send_official_document_fax_you" class="response-textbox" %}
+                        {% input_option type="text" name="address_to_send_official_document_fax_you" class="form-block input-wide response-textbox" %}
                         <p><em>Email Address (optional)</em></p>
-                        {% input_option type="text" id="email_textbox" name="address_to_send_official_document_email_you" class="response-textbox" %}
+                        {% input_option type="text" id="email_textbox" name="address_to_send_official_document_email_you" class="form-block input-wide response-textbox" %}
                     </div>
                 </div>
 
@@ -63,17 +63,17 @@
                         <h3>What is the best address to send your spouse official court documents?</h3>
                         <p><em>This is known as your "address for service"</em></p>
                         <p><em>House and street number</em></p>
-                        {% input_option type="text" name="address_to_send_official_document_street_spouse" class="response-textbox" %}
+                        {% input_option type="text" name="address_to_send_official_document_street_spouse" class="form-block input-wide response-textbox" %}
                         <p><em>City</em></p>
-                        {% input_option type="text" name="address_to_send_official_document_city_spouse" class="response-textbox" %}
+                        {% input_option type="text" name="address_to_send_official_document_city_spouse" class="form-block input-wide response-textbox" %}
                         <p><em>Prov/State</em></p>
-                        {% input_option type="text" name="address_to_send_official_document_prov_spouse" class="response-textbox" %}
+                        {% input_option type="text" name="address_to_send_official_document_prov_spouse" class="form-block input-narrow response-textbox" %}
 
                         <p>Country</p>
 
                         <div class="radio"><label>{% input_option type="radio" class="radio-with-other" name="address_to_send_official_document_country_spouse" value="Canada" %}Canada</label></div>
                         <div class="radio"><label>{% input_option type="radio" class="radio-with-other" name="address_to_send_official_document_country_spouse" value="USA" %}USA</label></div>
-                        <div class="radio"><label>{% input_option type="radio" class="radio-with-other radio_with_textbox" name="address_to_send_official_document_country_spouse" value="Other" %}Other {% input_option type="text" name="address_to_send_official_document_other_country_spouse" class="response-textbox other-textbox" tabindex="-1" %}</label></div>
+                        <div class="radio"><label>{% input_option type="radio" class="radio-with-other radio_with_textbox" name="address_to_send_official_document_country_spouse" value="Other" %}Other {% input_option type="text" name="address_to_send_official_document_other_country_spouse" class="response-textbox other-textbox input-inline" tabindex="-1" %}</label></div>
                     </div>
 
                     <div>
@@ -82,9 +82,9 @@
                             an address that’s not a PO box.</em></p>
 
                         <p><em>Fax number (optional)</em></p>
-                        {% input_option type="text" name="address_to_send_official_document_fax_spouse" class="response-textbox" %}
+                        {% input_option type="text" name="address_to_send_official_document_fax_spouse" class="form-block input-wide response-textbox" %}
                         <p><em>Email Address (optional)</em></p>
-                        {% input_option type="text" id="email_textbox" name="address_to_send_official_document_email_spouse" class="response-textbox" %}
+                        {% input_option type="text" id="email_textbox" name="address_to_send_official_document_email_spouse" class="form-block input-wide response-textbox" %}
                     </div>
                 </div>
 
diff --git a/edivorce/apps/core/templates/pdf/form35.html b/edivorce/apps/core/templates/pdf/form35.html
index 53ab20e2..6d9f8ddb 100644
--- a/edivorce/apps/core/templates/pdf/form35.html
+++ b/edivorce/apps/core/templates/pdf/form35.html
@@ -59,22 +59,22 @@
             [<em>Check all of the following boxes and file the following with this requisition.</em>]
         </p>
         <p class="schIndent1">
-            <i class="fa fa-square-o" aria-hidden="true"></i> draft of the order sought;
+            <i class="fa icon-check-empty">&#xf096;</i> draft of the order sought;
         </p>
         <p class="schIndent1">
-            <i class="fa fa-square-o" aria-hidden="true"></i> proof that the case is an undefended family law case;
+            <i class="fa icon-check-empty">&#xf096;</i> proof that the case is an undefended family law case;
         </p>
         <p class="schIndent1">
-            <i class="fa fa-square-o" aria-hidden="true"></i> certificate of the registrar in Form F36;
+            <i class="fa icon-check-empty">&#xf096;</i> certificate of the registrar in Form F36;
         </p>
         <p class="schIndent1">
-            <i class="fa fa-square-o" aria-hidden="true"></i> filing fee.
+            <i class="fa icon-check-empty">&#xf096;</i> filing fee.
         </p>
         <p>
             [<em>Check the following box and file the following with this requisition unless a response to family claim or response to counterclaim has been filed or unless this case is a joint family law case within the meaning of Rule 2-2 of the Supreme Court Family Rules</em>.]
         </p>
         <p class="schIndent1">
-            <i class="fa fa-square-o" aria-hidden="true"></i> proof of service of the notice of family claim or counterclaim, as the case may be.
+            <i class="fa icon-check-empty">&#xf096;</i> proof of service of the notice of family claim or counterclaim, as the case may be.
         </p>
         <p>
             [<em>Check the following box and file the following document with this requisition if</em>
@@ -88,13 +88,13 @@
             <em>(b) the family law case includes a claim for child support.</em>]
         </p>
         <p class="schIndent1">
-            <i class="fa fa-square-o" aria-hidden="true"></i> Child Support Affidavit in Form F37.
+            <i class="fa icon-check-empty">&#xf096;</i> Child Support Affidavit in Form F37.
         </p>
         <p>
             [<em>Check the following box and file the following document with this requisition if a divorce is sought.</em>]
         </p>
         <p class="schIndent1">
-            <i class="fa fa-square-o" aria-hidden="true"></i> affidavit in Form F38.
+            <i class="fa icon-check-empty">&#xf096;</i> affidavit in Form F38.
         </p>
         <p>
         </p>
@@ -102,7 +102,7 @@
             <tbody>
                 <tr>
                     <td colname="c1" valign="top"> Date: <span class="form-entry not-complete">[<em>dd/mmm/yyyy</em>]</span> </td>
-                    <td colname="c2" align="right"> <span class="form-entry not-complete">&nbsp;</span><br> Signature of <i class="fa fa-square-o" aria-hidden="true"></i> filing party <i class="fa fa-square-o" aria-hidden="true"></i> lawyer for filing party(ies) </td>
+                    <td colname="c2" align="right"> <span class="form-entry not-complete">&nbsp;</span><br> Signature of <i class="fa icon-check-empty">&#xf096;</i> filing party <i class="fa icon-check-empty">&#xf096;</i> lawyer for filing party(ies) </td>
                 </tr>
             </tbody>
         </table>
diff --git a/edivorce/apps/core/templates/pdf/form52.html b/edivorce/apps/core/templates/pdf/form52.html
index cdb8130d..299a6ab5 100644
--- a/edivorce/apps/core/templates/pdf/form52.html
+++ b/edivorce/apps/core/templates/pdf/form52.html
@@ -115,7 +115,7 @@
             <tr>
                 <td>
                     <p>
-                        <span class="form-entry not-complete">&nbsp;</span><br> Signature of<br> <i class="fa fa-square-o" aria-hidden="true"></i> party <i class="fa fa-square-o" aria-hidden="true"></i> lawyer for <span class="form-entry not-complete">[<em>name of party(ies)</em>]</span>
+                        <span class="form-entry not-complete">&nbsp;</span><br> Signature of<br> <i class="fa icon-check-empty">&#xf096;</i> party <i class="fa icon-check-empty">&#xf096;</i> lawyer for <span class="form-entry not-complete">[<em>name of party(ies)</em>]</span>
                     </p>
                     <p>
                         <span class="form-entry not-complete">[<em>type or print name</em>]</span>
@@ -123,7 +123,7 @@
                 </td>
                 <td>
                     <p>
-                        <span class="form-entry not-complete">&nbsp;</span><br> Signature of<br> <i class="fa fa-square-o" aria-hidden="true"></i> party <i class="fa fa-square-o" aria-hidden="true"></i> lawyer for <span class="form-entry not-complete">[<em>name of party(ies)</em>]</span>
+                        <span class="form-entry not-complete">&nbsp;</span><br> Signature of<br> <i class="fa icon-check-empty">&#xf096;</i> party <i class="fa icon-check-empty">&#xf096;</i> lawyer for <span class="form-entry not-complete">[<em>name of party(ies)</em>]</span>
                     </p>
                     <p>
                         <span class="form-entry not-complete">[<em>type or print name</em>]</span>
diff --git a/edivorce/apps/core/templates/prequalification/step_04.html b/edivorce/apps/core/templates/prequalification/step_04.html
index 178a1ff5..3691d465 100644
--- a/edivorce/apps/core/templates/prequalification/step_04.html
+++ b/edivorce/apps/core/templates/prequalification/step_04.html
@@ -63,11 +63,11 @@
                     <div class="reveal" id="financial_support" hidden>
                         <h3>Are you financially supporting any of the children that are 19 years or older? Please check all that apply.</h3>
                         <div class="checkbox-group">
-                            <div class="radio"><label>{% input_option type="checkbox" name="children_financial_support" value="No" data_target_id="need_support" data_reveal_target="false" %}No</label></div>
-                            <div class="radio"><label>{% input_option type="checkbox" name="children_financial_support" value="Yes, attending post secondary institution (e.g. college, university)" data_target_id="need_support" data_reveal_target="true" %}Yes, attending post secondary institution (e.g. college, university)</label></div>
-                            <div class="radio"><label>{% input_option type="checkbox" name="children_financial_support" value="Yes, due to disability" data_target_id="need_support" data_reveal_target="true" %}Yes, due to disability</label></div>
-                            <div class="radio"><label>{% input_option type="checkbox" name="children_financial_support" value="Yes, due to illness" data_target_id="need_support" data_reveal_target="true" %}Yes, due to illness</label></div>
-                            <div class="radio"><label>{% input_option type="checkbox" name="children_financial_support" value="Yes, other reason" data_target_id="need_support" data_reveal_target="true" %}Yes, other reason(s)</label></div>
+                            <div class="checkbox"><label>{% input_option type="checkbox" name="children_financial_support" value="No" data_target_id="need_support" data_reveal_target="false" %}No</label></div>
+                            <div class="checkbox"><label>{% input_option type="checkbox" name="children_financial_support" value="Yes, attending post secondary institution (e.g. college, university)" data_target_id="need_support" data_reveal_target="true" %}Yes, attending post secondary institution (e.g. college, university)</label></div>
+                            <div class="checkbox"><label>{% input_option type="checkbox" name="children_financial_support" value="Yes, due to disability" data_target_id="need_support" data_reveal_target="true" %}Yes, due to disability</label></div>
+                            <div class="checkbox"><label>{% input_option type="checkbox" name="children_financial_support" value="Yes, due to illness" data_target_id="need_support" data_reveal_target="true" %}Yes, due to illness</label></div>
+                            <div class="checkbox"><label>{% input_option type="checkbox" name="children_financial_support" value="Yes, other reason" data_target_id="need_support" data_reveal_target="true" %}Yes, other reason(s)</label></div>
                         </div>
                         <div class="information-message bg-danger" id="need_support" hidden>
                             <p>Sorry but at this point in time you will not be able to complete your application for divorce using this online tool.