add task solution

mate-academy · Aug 5, 2024 · 0d37eb4 · 0d37eb4
1 parent bc88c03
commit 0d37eb4
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 5 deletions.
diff --git a/src/index.html b/src/index.html
@@ -169,14 +169,15 @@ <h2 class="slider__title">Галерея</h2>
         <div class="subscription__content">
           <h2 class="subscription__title">Підписка</h2>
           <p class="subscription__description">Бути в курсі всіх актуальних подій та останніх новин.</p>
-          <form class="subscription__form" action="#">
+          <form action="https://example.com/form-handler" method="POST" target="hidden_iframe" onsubmit="submitted=true; this.reset();">
             <div class="subscription__input-wrapper">
               <input class="subscription__input" placeholder="E-mail" type="email" name="email" required>
               <div class="subscription__button-wrapper">
                 <button class="subscription__button" type="submit"></button>
               </div>
             </div>
           </form>
+          <iframe name="hidden_iframe" style="display:none;"></iframe>
         </div>
       </section>
     </main>
@@ -185,10 +186,10 @@ <h2 class="subscription__title">Підписка</h2>
       <div class="container">
         <div class="footer__container">
           <div class="footer__icons">
-            <img src="./images/logo/logo.png" class="footer__logo">
+            <img src="./images/logo/logo.png" class="footer__logo" alt="Logo">
             <div class="footer__social-icons">
-              <a href="#" class="footer__icon footer__icon-facebook"></a>
-              <a href="#" class="footer__icon footer__icon-instagram"></a>
+              <a href="https://www.facebook.com/yourprofile" class="footer__icon footer__icon-facebook" target="_blank" rel="noopener noreferrer"></a>
+              <a href="https://www.instagram.com/yourprofile" class="footer__icon footer__icon-instagram" target="_blank" rel="noopener noreferrer"></a>
             </div>
           </div>
           <div class="footer-schedule">

diff --git a/src/styles/blocks/footer.scss b/src/styles/blocks/footer.scss
@@ -116,6 +116,7 @@
       line-height: 21px;
       text-decoration: none;
       color: #000;
+      @include hover(transform, scale(1.05));
     }
   }
 

diff --git a/src/styles/blocks/header.scss b/src/styles/blocks/header.scss
@@ -137,6 +137,8 @@
       width: 230px;
       height: 50px;
       border: 1px solid #1A5A4C;
+      background-color: #fff;
+      cursor: pointer;
 
 
       @include onTablet {
@@ -154,6 +156,7 @@
       align-items: center;
       justify-content: center;
       border: 1px solid #1A5A4C;
+      cursor: pointer;
 
       @include onTablet {
         width: 70px;

diff --git a/src/styles/blocks/subscription.scss b/src/styles/blocks/subscription.scss
@@ -1,3 +1,19 @@
+.subscription__input:-webkit-autofill,
+.subscription__input:-webkit-autofill:hover,
+.subscription__input:-webkit-autofill:focus,
+.subscription__input:-webkit-autofill:active {
+  font-family: Poppins, sans-serif;
+  font-size: 15px;
+  font-weight: 600;
+  line-height: 22.5px;
+  color: #fff;
+  background-color: #2C2C2C;
+  border: none;
+  -webkit-text-fill-color: #fff;
+  -webkit-box-shadow: 0 0 0px 1000px #2C2C2C inset;
+}
+
+
 .subscription {
   @include pageGrid;
   margin-top: 100px;
@@ -86,7 +102,7 @@
     width: 24px;
     height: 24px;
     border: none;
-
+    cursor: pointer;
 
 
     &-wrapper {
@@ -96,6 +112,7 @@
       width: 50px;
       height: 100%;
       background-color: #F14A27;
+      cursor: pointer;
       @include hover(transform, scale(1.1));