From b264f8677b5d3c894a36a55f8e599473c81de65b Mon Sep 17 00:00:00 2001
From: Melnyk <andrian_m@ukr.net>
Date: Mon, 4 Mar 2024 21:03:48 +0200
Subject: [PATCH] fixed overlapping, button text style, made footer information
 as corresponding links

---
 src/index.html                     | 35 +++++++++++++++++++-----------
 src/styles/blocks/_button.scss     |  8 +++++--
 src/styles/blocks/_categories.scss |  2 +-
 src/styles/blocks/_form.scss       |  1 +
 src/styles/blocks/_info.scss       |  8 +++++++
 src/styles/blocks/_product.scss    |  5 +++--
 6 files changed, 41 insertions(+), 18 deletions(-)

diff --git a/src/index.html b/src/index.html
index 2de53d82a5..65ff1e959e 100644
--- a/src/index.html
+++ b/src/index.html
@@ -16,7 +16,6 @@
     <link rel="stylesheet" href="./styles/main.scss" />
 
     <script src="./scripts/showPhoneNumber.js" defer></script>
-    <script src="./scripts/preventReload.js" defer></script>
     <script src="./scripts/hidingOverflow.js" defer></script>
 
   </head>
@@ -319,7 +318,7 @@ <h2 class="section-title contact-us__title">
 
               <button
                 id="send-button"
-                type="submit"
+                type="reset"
                 class="
                 button
                 button__primary
@@ -332,25 +331,35 @@ <h2 class="section-title contact-us__title">
             <div class="contact-us__info info">
               <div class="info__field">
                 <label class="info__label">Phone</label>
-                <p class="info__information">
+                <a
+                  class="info__information"
+                  href="tel: +1 234 5555-55-55"
+                  >
                   +1 234 5555-55-55
-                </p>
+                </a>
               </div>
               <div class="info__field">
                 <label class="info__label">Email</label>
-                <p class="info__information">
+                <a
+                  class="info__information"
+                  href="mailto:hello@bang&olufsen.com"
+                >
                   hello@bang&olufsen.com
-                </p>
+                </a>
               </div>
               <div class="info__field">
                 <p class="info__label">Adress</p>
-                <p class="info__information">
-                  400 first ave.
-                  <br>
-                  suite 700
-                  <br>
-                  Minneapolis, MN 55401
-                </p>
+                <a
+                  class="info__information"
+                  href="https://maps.app.goo.gl/N918GZqXPwQ5tH4CA"
+                  >
+                  <p
+                    class="info__information-paragraph">
+                    <span>400 first ave.</span>
+                    <span>suite 700</span>
+                    <span>Minneapolis, MN 55401</span>
+                  </p>
+                </a>
               </div>
             </div>
           </div>
diff --git a/src/styles/blocks/_button.scss b/src/styles/blocks/_button.scss
index d8a1415063..0bad770989 100644
--- a/src/styles/blocks/_button.scss
+++ b/src/styles/blocks/_button.scss
@@ -17,9 +17,9 @@
   border-radius: 8px;
   padding: 14.5px;
   justify-content: center;
-  font-style: 16px;
+  font-size: 16px;
   font-weight: 700;
-
+  font-family: Manrope;
 
   &__link {
     text-decoration: none;
@@ -31,5 +31,9 @@
 
     @include hover(background-color, $primary-button-bg--hovered);
     @include focus(background-color, $primary-button-bg--focused);
+
+    &:focus {
+      background-color: $primary-button-bg--focused;
+    }
   }
 }
diff --git a/src/styles/blocks/_categories.scss b/src/styles/blocks/_categories.scss
index c4291fdf94..a98964d1c6 100644
--- a/src/styles/blocks/_categories.scss
+++ b/src/styles/blocks/_categories.scss
@@ -17,7 +17,7 @@
   }
 
   &__link {
-    @include hover (transform, scale(1.2));
+    @include hover (transform, scale(1.05));
 
     position: relative;
     height: 0;
diff --git a/src/styles/blocks/_form.scss b/src/styles/blocks/_form.scss
index 30e40b3163..006b79e2e4 100644
--- a/src/styles/blocks/_form.scss
+++ b/src/styles/blocks/_form.scss
@@ -37,6 +37,7 @@
 
   &__button {
     border: none;
+    cursor: pointer;
     margin-top: calc($form-button-margin - $form-gap);
   }
 }
diff --git a/src/styles/blocks/_info.scss b/src/styles/blocks/_info.scss
index e2e31463c9..e9bcdb24f9 100644
--- a/src/styles/blocks/_info.scss
+++ b/src/styles/blocks/_info.scss
@@ -10,5 +10,13 @@
 
   &__information {
     margin-top: 8px;
+    text-decoration: none;
+    display: block;
+    color: inherit;
+  }
+
+  &__information-paragraph {
+    display: grid;
+    max-width: max-content;
   }
 }
diff --git a/src/styles/blocks/_product.scss b/src/styles/blocks/_product.scss
index 66fb227a40..dc28afe022 100644
--- a/src/styles/blocks/_product.scss
+++ b/src/styles/blocks/_product.scss
@@ -4,8 +4,9 @@
   justify-content: center;
   max-width: 600px;
   background-color: white;
-  
-  @include hover(transform, scale(1.2));
+  cursor: pointer;
+
+  @include hover(transform, scale(1.05));
 
   &__photo {
     width: 100%;