добавил соц иконки и пофиксил скролл на мобилке

arrkhip · Mar 27, 2022 · 2585d4c · 2585d4c
1 parent 1868d09
commit 2585d4c
Show file tree

Hide file tree

Showing 6 changed files with 66 additions and 2 deletions.
diff --git a/src/js/modules/locomotiveScroll.js b/src/js/modules/locomotiveScroll.js
@@ -1,6 +1,10 @@
 import LocomotiveScroll from 'locomotive-scroll';
 
-window.addEventListener('load', init);
+const isMobile = window.matchMedia('(max-width: 900px)');
+
+if (!isMobile.matches) {
+  window.addEventListener('load', init);
+}
 
 function init() {
   const $container = document.querySelector('[data-scroll-container]');

diff --git a/src/modules/sections/footer.hbs b/src/modules/sections/footer.hbs
@@ -108,6 +108,20 @@
                     <a href="tel: +79282103110" class="footer__phone">
                       +7 (928) 210-31-10
                     </a>
+
+                    <div class="footer__socials">
+                      <a href="#" class="footer__social footer__social--w">
+                        <svg class="svg">
+                          <use xlink:href="svg/sprite.svg#social-w"></use>
+                        </svg>
+                      </a>
+
+                      <a href="#" class="footer__social footer__social--t">
+                        <svg class="svg">
+                          <use xlink:href="svg/sprite.svg#social-t"></use>
+                        </svg>
+                      </a>
+                    </div>
                   </li>
                 </ul>
               </div>

diff --git a/src/scss/components/card-service.scss b/src/scss/components/card-service.scss
@@ -13,7 +13,7 @@
 
     .card-service__banner {
       img {
-        [data-scroll-container] & {
+        .has-scroll-smooth & {
           opacity: 0;
           transform: scale(1.4);
         }

diff --git a/src/scss/sections/footer.scss b/src/scss/sections/footer.scss
@@ -216,6 +216,42 @@
   }
 }
 
+.footer__socials {
+  display: inline-flex;
+  align-items: center;
+  margin-left: 17px;
+}
+
+.footer__social {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+
+  &--w {
+    color: #07d528;
+
+    &:hover {
+      color: #12b32c;
+    }
+  }
+
+  &--t {
+    color: #039be5;
+
+    &:hover {
+      color: #1c85b9;
+    }
+  }
+
+  &:not(:last-child) {
+    margin-right: 3px;
+  }
+
+  .svg {
+    font-size: 32px;
+  }
+}
+
 .footer__phone {
   font-size: 16px;
   font-weight: 300;

diff --git a/src/svg/social-t.svg b/src/svg/social-t.svg
diff --git a/src/svg/social-w.svg b/src/svg/social-w.svg