fix bg colour on cookie popup

add bare bones checkbox to form et all

js/routes/cookies.js

@@ -42,8 +42,8 @@ export default (hostComponent) => {
         flex-direction: column;
         align-items: flex-start;
         border-radius: 10px;
-        background-color: white; 
-        border: none;
+        background-color: var(--bg-color);
+        border: 1px solid var(--border-color);
     }
     #nikos-modal-label {
         font-size: 18px;
@@ -57,15 +57,7 @@ export default (hostComponent) => {
         width: 100%;
         margin-bottom: 1rem;
     }
-    button#save-preferences {
-        background-color: #3897f0; 
-        color: white;
-        border: none;
-        border-radius: 5px;
-        padding: 10px 20px;
-        align-self: center; 
-        cursor: pointer;
-    }
+ 
 </style>
 `;
 

js/routes/form.js

@@ -1,21 +1,35 @@
 export default (hostComponent) => {
   hostComponent.innerHTML = '';
 
+  //language=HTML
   const indexHTML = `
 
   <h1>Welcome to the Form route!</h1>
 <form class="centered">
  <h2>Centered class form</h2>
 
   <div>
-    <label for="name">Name:</label>
+    <label for="name">Name</label>
     <input type="text" id="name" name="name">
     </div>
     <div>
-    <label for="password">Password:</label>
+    <label for="password">Password</label>
     <input type="password" id="password" name="password">
   </div>
 
+  <div>
+    <label for="iagree">I agree</label>
+    <input type="checkbox" name="iagree" id="iagree">
+  </div>
+  <div>
+    <label for="date">Date</label>
+    <input type="date" name="date" id="date">
+  </div>
+  <div>
+    <label for="range">Range</label>
+    <input type="range" name="range" id="range">
+  </div>
+
   <button type="submit">Submit</button>
 </form>
   `;