Added terms and conditions logic

static/css/main.css

@@ -270,7 +270,7 @@ article li:not(:first-of-type){
   border: 2px solid white;
   border-radius: 50%;
 }
-.profile .label{
+.profile .label, #signal-modal label{
   font-weight: 700;
 }
 .user-description{
@@ -318,11 +318,14 @@ article li:not(:first-of-type){
   color: white;
   padding: 0.5em 1.5em;
 }
-
-
 .btn-cta, .btn-primary, .btn-secondary, .btn-outline-primary, .btn-outline-secondary{
   font-size: 1em;
 }
+.btn:disabled, .btn.disabled{
+  background: var(--bs-gray-400);
+  color: var(--bs-gray-600);
+  border-color: var(--bs-gray-500);
+}
 /* forms */
 .lang-select{
   max-width: 12em;
@@ -342,11 +345,33 @@ ul, ol{
 .rounded{
   --bs-border-radius: 2rem;
 }
+.emphasis{
+  color: var(--bs-link-color);
+}
+sup.emphasis{
+  margin-left: 0.125rem;
+  margin-right: 0.125rem;
+}
+.validated{
+  display: flex;
+  align-items: center;
+}
+.validated::before{
+  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="icon-ui"><path stroke-linecap="round" stroke-linejoin="round" d="m4.5 12.75 6 6 9-13.5" /></svg>');
+  margin-right: 0.5rem;
+  width: 1.5em;
+  height: 1.5em;
+  display: inline-flex;
+}
 
 /*modals*/
 .modal-header{
   border-bottom: none;
 }
+.modal-title{
+  width: 100%;
+  text-align: center;
+}
 
 /* footer */
 footer{
@@ -443,7 +468,7 @@ nav .icon-ui{
     display: grid;
     gap: 0 .5rem;
 	  width: fit-content;
-	  margin: calc(var(--div-padding) / 1.25) auto 0;
+	  margin: calc(var(--div-padding) / 3) auto 0;
   }
   .offcanvas .user-avatar{
     margin: 0 auto;

static/img/icons/check.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="icon-ui">
+  <path stroke-linecap="round" stroke-linejoin="round" d="m4.5 12.75 6 6 9-13.5" />
+</svg>

static/js/check.js

@@ -0,0 +1,14 @@
+document.addEventListener("DOMContentLoaded", function() {
+    const checkTerms = document.querySelector('#cgv-check');
+    const createAccountButton = document.querySelector('#btnCreateAccount');
+    const readTerms = document.querySelector('#readTerms');
+    console.log(checkTerms, createAccountButton);
+    checkTerms.addEventListener("change", function() {
+        createAccountButton.disabled = !checkTerms.checked;
+        if (checkTerms.checked) {
+            readTerms.classList.add("validated");
+        } else {
+            readTerms.classList.remove("validated");
+        }  
+    });
+});