Merge pull request #106 from bcgov/DIV-1003

DIV-1003: Update intro page

edivorce/apps/core/static/css/main.scss

@@ -1,13 +1,13 @@
 /* compileCompressed: $1.css*/
-$body-copy: #494949;
-$brand-blue: #042553;
+$body-copy: #313132;
+$brand-blue: #003366;
 $brand-gold: #fcba19;
 $brand-titles: #003366;
 $brand-links: #365ebe;
 /*#2b5580;*/
 $brand-buttons: $brand-links;
 $color-blue-dark: $brand-titles;
-$color-blue-medium: #2b5580;
+$color-blue-medium: #38598A;
 $color-blue-light: $brand-buttons;
 $color-blue-lighter: #d4dce5;
 $color-grey-dark: $body-copy;
@@ -1505,7 +1505,11 @@ textarea {
             color: #ffffff;
             position: relative;
 
-            h1,
+            h1 {
+                color: $color-blue-dark;
+                max-width: 500px;
+                margin: 0 auto;
+            }
             h2,
             h3 {
                 color: #ffffff;
@@ -1598,6 +1602,31 @@ textarea {
         }
     }
 }
+.intro-footer {
+    text-align: center;
+    padding-bottom: 92px;
+    background: #ffffff;
+    .column {
+        max-width: 640px;
+        margin: 0 auto;
+    }
+    h3 {
+        color: $color-blue-dark;
+        font-size: 24px;
+        line-height: 36px;
+        padding-top: 60px;
+        padding-bottom: 35px;
+        margin: 0;
+    }
+    .btn {
+        width: 260px;
+        height: 48px;
+        font-weight: bold;
+        line-height: 24px;
+        border-radius: 8px;
+    }
+}
+
 /* Side Progress Navigation */
 .dashnav-column,
 .overview-progress,
@@ -1953,7 +1982,7 @@ textarea {
 }
 
 .shaded-box {
-    background-color: rgba(0,0,0,0.35);
+    background-color: rgba(0,0,0,0.7);
 }
 
 #delete_child_modal,

edivorce/apps/core/templates/base.html

@@ -38,18 +38,14 @@
                 <div class="row">
                     <div class="col-sm-8">
                         <div class="top_banner-logo">
-                            <a href="{% url 'home' %}"><img src="{% static 'svg/bc-logo.svg' %}" /></a>
+                            <a href="{% url 'home' %}"><img src="{% static 'svg/bc-logo.svg' %}" alt="Go to the homepage of the BC government's Online Divorce Assistant"/></a>
                             <p>Online Divorce Assistant
                                 {% if deployment_environment == 'dev' %}
                                     <span class="beta environment-type">dev</span>
                                 {% elif deployment_environment == 'test' %}
                                     <span class="beta environment-type">test</span>
-                                {% elif deployment_environment == 'prod' %}
-                                    <span class="beta environment-type">beta</span>
                                 {% elif deployment_environment == 'localdev' %}
                                     <span class="beta environment-type">localdev</span>
-                                {% else %}
-                                    <span class="beta environment-type">beta</span>
                                 {% endif %}
                             </p>
                         </div>
@@ -128,6 +124,8 @@
 {#            {% endblock %}#}
 
         </div>
+        {% block intro-footer %}
+        {% endblock %}
 
         <footer class="footer">
             <div class="footer-container clearfix">

edivorce/apps/core/templates/intro.html

@@ -6,9 +6,7 @@
 {% block container_col %}shroud{% endblock %}
 
 {% block content %}
-    <h1>Make Your Joint Divorce<span class="footnote-marker">*</span> Process Manageable</h1>
-
-<p class="intro">Forms, deadlines, tasks... Divorce can be a difficult enough time as it is without having to navigate through confusing legal language. That's why this online tool is here: to help you get through the details, procedures, and paperwork.</p>
+    <h1>Make Your Joint Divorce* Process Manageable</h1>
 
 <h2 class="shaded-box">How it Works</h2>
 
@@ -21,9 +19,12 @@
     </div>
 
     <div class="flex-column right">
-        <h3><span class="number-circle">2</span> Print Your Forms</h3>
+        <h3><span class="number-circle">2</span> Print or File Online</h3>
         <p>
-            Once you're done with the questions, you'll print your papers and file at your local court registry. That’s all there is to it!
+            Once you're done with the questions,
+            you can print your papers and file at your local court registry
+            or file them online.
+            That’s all there is to it!
         </p>
     </div>
 </div>
@@ -31,27 +32,28 @@
 
 
 <div class="footnote shaded-box">
-    <h5><strong>*Beta Service - Joint Divorce Only</strong></h5>
+    <h5><strong>*Joint Divorce Only</strong></h5>
     <p>
         Joint divorce means making an application for a divorce together with your spouse. It means that you and your
         spouse agree about getting a divorce and that you agree about all of the family law issues relevant to your
         situation, such as spousal support, and the division of family property and debts.
 </p>
 </div>
+{% endblock %}
 
-<div class="information-message">
-    <p>
-    </p>
+{% block intro-footer %}
+<div class="intro-footer">
+    <div class="column">
+        <h3>
+            Begin the process of completing forms for a new divorce:
+        </h3>
+        <a href="{% url 'prequalification' '01' %}" class="btn btn-primary btn-lg">New Divorce</a>
+        <h3>
+            Already started completing forms online and want to pick up where you left off?
+        </h3>
+        <a href="{% url 'login' %}" class="btn btn-primary btn-lg">Returning users</a>
+    </div>
 </div>
-
-<p>
-    <a href="{% url 'prequalification' '01' %}" class="btn btn-primary btn-lg">New User - Let’s get started</a>
-</p>
-
-<p>
-    <strong>Returning User?</strong><a href="{% url 'login' %}"><br />Log in with BCeID or BC Services Card</a>
-</p>
-
 {% endblock %}
 
 {% block formbuttons %}