From 0e0ff5b61a1ac9c9fda404870a8dba39254e2473 Mon Sep 17 00:00:00 2001
From: Anais Assamoi <anaisassamoi02@gmail.com>
Date: Wed, 6 Jan 2021 12:17:59 +0100
Subject: [PATCH] fix #1

---
 starterOnly/modal.css | 25 +++++++++++++------------
 starterOnly/modal.js  | 11 +++++++++++
 2 files changed, 24 insertions(+), 12 deletions(-)

diff --git a/starterOnly/modal.css b/starterOnly/modal.css
index 38cdea6251..27a10c3ecf 100644
--- a/starterOnly/modal.css
+++ b/starterOnly/modal.css
@@ -35,10 +35,10 @@ img {
   margin: 3.5%;
 }
 .header-logo {
-    float: left;
+  float: left;
 }
 .main-navbar {
-    float: right;
+  float: right;
 }
 .topnav a {
   float: left;
@@ -69,7 +69,9 @@ img {
 }
 
 @media screen and (max-width: 768px) {
-  .topnav a {display: none;}
+  .topnav a {
+    display: none;
+  }
   .topnav a.icon {
     float: right;
     display: block;
@@ -77,7 +79,9 @@ img {
 }
 
 @media screen and (max-width: 768px) {
-  .topnav.responsive {position: relative;}
+  .topnav.responsive {
+    position: relative;
+  }
   .topnav.responsive .icon {
     position: absolute;
     right: 0;
@@ -90,16 +94,16 @@ img {
   }
 }
 
-
-
- @media screen and (max-width: 540px) {
-  .topnav a {display: none;}
+@media screen and (max-width: 540px) {
+  .topnav a {
+    display: none;
+  }
   .topnav a.icon {
     float: right;
     display: block;
     margin-top: -15px;
   }
-} 
+}
 
 main {
   font-size: 130%;
@@ -111,8 +115,6 @@ main {
   margin: 1px 20px 15px;
   border-radius: 2rem;
   text-align: justify;
-
-
 }
 
 .modal-btn {
@@ -526,4 +528,3 @@ footer {
     opacity: 1;
   }
 }
-
diff --git a/starterOnly/modal.js b/starterOnly/modal.js
index 694a848564..1e2436fb37 100644
--- a/starterOnly/modal.js
+++ b/starterOnly/modal.js
@@ -11,6 +11,7 @@ function editNav() {
 const modalbg = document.querySelector(".bground");
 const modalBtn = document.querySelectorAll(".modal-btn");
 const formData = document.querySelectorAll(".formData");
+const modalCloseBtn = document.querySelectorAll(".close");
 
 // launch modal event
 modalBtn.forEach((btn) => btn.addEventListener("click", launchModal));
@@ -20,4 +21,14 @@ function launchModal() {
   modalbg.style.display = "block";
 }
 
+// close modal event
+modalCloseBtn[0].addEventListener("click", closeModal, false);
+
+// close modal form
+function closeModal() {
+  modalbg.style.display = "none";
+}
+
+
+