Finish legal agreement

views/merchantSetupPage/agreement.js

@@ -2,5 +2,16 @@ let agreementObj = {
     display: function(){
         controller.clearScreen();
         controller.agreementStrand.style.display = "flex";
+    },
+
+    agree: function(){
+        let checkbox = document.querySelector("#agreementStrand input");
+        let button = document.querySelector("#agreementStrand button");
+
+        if(checkbox.checked){
+            button.disabled = false;
+        }else{
+            button.disabled = true;
+        }
     }
 }

views/merchantSetupPage/merchantSetup.css

@@ -16,7 +16,8 @@
 /* Agreement Strand */
 #agreementStrand{
     display: flex;
-    justify-content: center;
+    flex-direction: column;
+    align-items: center;
 }
 
     #agreementStrand > *{
@@ -58,7 +59,7 @@
         margin: 10px;
     }
 
-/* nameRecipesStrand */
+/* Name Recipes Strand */
 #nameRecipesStrand{
     display: none;
 }
@@ -67,7 +68,7 @@
         margin: 10px;
     }
 
-/* createRecipesStrand */
+/* Create Recipes Strand */
 #createRecipesStrand{
     display: none;
 }

views/merchantSetupPage/merchantSetup.ejs

@@ -14,6 +14,12 @@
 
         <div id="agreementStrand">
             <% include ../shared/legal %>
+
+            <label>
+                <input onclick="agreementObj.agree()" type="checkbox">
+            I agree to all terms and conditions</label>
+
+            <button onclick="basicInfoObj.display()" disabled>Continue</button>
         </div>
 
         <div id="basicInfoStrand" class="container">