DIV-210 added modals to first two questions

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

@@ -732,6 +732,30 @@ textarea {
 	}
 }
 
+/* Modals */
+
+#questions_modal {
+	font-size: 18px;
+	.modal-header {
+		text-align: center;
+		i {
+			background-color: $brand-links;
+			color: #ffffff;
+		    height: 80px;
+		    width: 80px;
+		    border-radius: 40px;
+		    font-size: 40px;
+		    padding: 20px;
+		    margin-bottom: 15px;
+		}
+	}
+	.modal-footer {
+		text-align: center;
+		border: none;
+		padding-bottom: 30px;
+	}
+}
+
 /* Spinner */
 div#progress-overlay {
     position: fixed;

edivorce/apps/core/static/js/main.js

@@ -11,6 +11,11 @@ $('input:radio, input:checkbox').each(function () {
     }
 });
 
+$(window).load(function(){
+    $('#questions_modal').modal('show');
+    console.log("loading");
+});
+
 $(function () {
   $('[data-toggle="popover"]').popover()
 })

edivorce/apps/core/templates/question/01_orders.html

@@ -117,6 +117,23 @@
     </div>
 </div>
 
+<div id="questions_modal" class="modal fade" tabindex="-1" role="dialog">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <i class="fa fa-commenting" aria-hidden="true"></i>
+                <h1 class="modal-title">What are you asking for?</h1>
+            </div>
+            <div class="modal-body">
+                <p>With an undefended divorce (you and your spouse agree on how to deal with your parenting, support, and property and debt issues) 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).</p>
+            </div>
+            <div class="modal-footer">
+                <a type="button" class="btn btn-primary btn-lg" data-dismiss="modal">Continue</a>
+            </div>
+        </div>
+    </div>
+</div>
+
 {% endblock %}
 
 {% block formBack %}{% url 'overview' %}{% endblock %}

edivorce/apps/core/templates/question/02_claimant.html

@@ -137,6 +137,23 @@
     </div>
 </div>
 
+<div id="questions_modal" class="modal fade" tabindex="-1" role="dialog">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <i class="fa fa-info" aria-hidden="true"></i>
+                <h1 class="modal-title">Your information</h1>
+            </div>
+            <div class="modal-body">
+                <p>Tell us who you are.  Make sure you have a copy of your marriage certificate. The spelling of your names must match the format on the marriage certificate.</p>
+            </div>
+            <div class="modal-footer">
+                <a type="button" class="btn btn-primary btn-lg" data-dismiss="modal">Continue</a>
+            </div>
+        </div>
+    </div>
+</div>
+
 {% endblock %}
 
 {% block formBack %}{% url 'question_steps' '01_orders' %}{% endblock %}