fixing bugs

src/index.html

@@ -362,6 +362,7 @@ <h2 class="expertise-title">Our Expertise</h2>
                     id="email"
                     name="email required"
                     placeholder="Email"
+                    required
                     >
                   </label>
                 </div>
@@ -373,6 +374,7 @@ <h2 class="expertise-title">Our Expertise</h2>
                     id="name"
                     name="name required"
                     placeholder="Your name"
+                    required
                     >
                   </label>
                 </div>
@@ -383,9 +385,10 @@ <h2 class="expertise-title">Our Expertise</h2>
                     name="message"
                     id="text"
                     cols="3"
-                    rows="3"
+                    rows="2"
                     class="input"
                     placeholder="Your message"
+                    required
                     ></textarea>
                   </label>
                 </div>
@@ -406,27 +409,28 @@ <h2 class="expertise-title">Our Expertise</h2>
               <div class="contacts__action-name">Visit us</div>
               <div class="contacts__info">
                 <a href="https://www.google.com.ua/maps/search/2905+West+Drive,+Buffalo+Grove/@42.1697801,-87.9935227,13z/data=!3m1!4b1?entry=ttu"
+                  target="_blank"
                   class="contacts__info--link">2905 West Drive, Buffalo Grove
                 </a>
               </div>
 
               <div class="contacts__action-name">Our socials</div>
               <div class="contacts__socials">
-                <a href="#">
+                <a href="https://www.facebook.com/" target="_blank">
                   <img src="./images/social/facebook.svg"
                   alt="facebook"
                   class="social"
                   >
                 </a>
 
-                <a href="#">
+                <a href="https://twitter.com/" target="_blank">
                   <img src="./images/social/twitter.svg"
                   alt="twitter"
                   class="social"
                   >
                 </a>
 
-                <a href="#">
+                <a href="https://www.instagram.com/" target="_blank">
                   <img src="./images/social/instagram.svg"
                   alt="instagram"
                   class="social">

src/scripts/main.js

@@ -7,18 +7,19 @@
 // #region burger
 let headerNav = document.querySelector('.header__nav');
 let burgerIcon = document.querySelector('.header__burger-icon');
-let body = document.querySelector('body');
+let body = document.querySelector('.body');
 
 burgerIcon.addEventListener('click', function() {
   this.classList.toggle('active');
   headerNav.classList.toggle('open');
-  body.classList.toggle('open');
+  body.classList.add('open');
 });
 
 document.querySelectorAll('.header__nav a.nav__link').forEach(function(link) {
   link.addEventListener('click', function() {
     headerNav.classList.remove('open');
     burgerIcon.classList.remove('active');
+    body.classList.remove('open');
   });
 });
 // #endregion

src/styles/blocks/footer.scss

@@ -46,13 +46,14 @@
   width: 460px;
   outline: none;
   border: none;
-  border-bottom: 1px solid blue;
+  border-bottom: 1px solid #fff;
   padding-bottom: 16px;
   margin: 56px 0 48px 0;
   font-weight: 600;
   font-size: 15px;
   color: #fff;
   background-color: #2C2C2C;
+  transition: 0.3s ease-in-out;
 
   @include onTablet {
     width: 362px;
@@ -63,14 +64,18 @@
   }
 }
 
-#text {
-  padding-bottom: 0;
-  margin: 56px 0 0 0;
-  resize: none;
+input:focus {
+  border-bottom: 1px solid blue;
 }
 
-.text::placeholder {
+textarea:focus {
+  border-bottom: 1px solid blue;
+}
 
+#text {
+  padding: 0;
+  margin: 56px 0 0 0;
+  resize: none;
 }
 
 .button--send {
@@ -113,7 +118,7 @@
   line-height: 150%;
   margin-bottom: 48px;
   text-decoration: none;
-  transition: text-shadow 0.1s ease-in-out;
+  transition: text-shadow 0.3s ease-in-out;
 }
 
 .contacts__info--link:hover {

src/styles/blocks/header.scss

@@ -158,6 +158,11 @@
   justify-content: center;
   border-radius: 8px;
   cursor: pointer;
+  transition: 0.3s ease-in-out;
+}
+
+.button:hover {
+  background: #0036b5;
 }
 
 .button__text {

src/styles/blocks/navigation.scss

@@ -4,11 +4,6 @@
 
 }
 
-.open {
-  display: flex !important;
-}
-
-
 .header__nav {
 
   @include onTablet {
@@ -24,7 +19,7 @@
     bottom: 0;
     left: 0;
     right: 0;
-    z-index: 50;
+    z-index: 2;
     overflow-y: auto;
     padding: 50px 40px;
     background-color: #000;

src/styles/blocks/page.scss

@@ -1,3 +1,3 @@
-body.open {
+.body.open {
   overflow: hidden;
 }