Merge pull request #133 from KirillKapteily/Kirill-footer

Fixed up button
KirillKapteily · Jan 26, 2025 · a186296 · a186296
2 parents 71e2cb9 + 7a7ec6b
commit a186296
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 13 deletions.
diff --git a/src/partials/footer.html b/src/partials/footer.html
@@ -10,13 +10,14 @@
 
 <body>
   <footer class="footer">
-<div class="footer__up">
-         <a href="#" class="up__button"><svg class="fotter__icon__up">
-        <use href="./img/footer/symbol-defs.svg#icon-up" width="30" height="30"></use>
-    </svg></a>
-      </div>
+
+
     <div class="footer__container">
-
+      <div class="footer__up">
+        <a href="#" class="up__button"><svg class="footer__icon__up">
+       <use href="./img/footer/symbol-defs.svg#icon-up" width="30" height="30"></use>
+   </svg></a>
+     </div>
 
       <hr class="hr">
       <div class="footer__logo m-40">
@@ -34,17 +35,17 @@
         <h4 class="footer__social-title  dm-sans">WE IN SOCIAL</h4>
         <div class="footer__icons">
           <a href="#" class="footer__social-link">
-            <svg class="fotter__icon">
+            <svg class="footer__icon">
               <use href="./img/footer/symbol-defs.svg#icon-facebook" width="40" height="40"></use>
           </svg>
           </a>
           <a href="#" class="footer__social-link">
-            <svg class="fotter__icon">
+            <svg class="footer__icon">
               <use href="./img/footer/symbol-defs.svg#icon-instagram" width="40" height="40"></use>
           </svg>
           </a>
           <a href="#" class="footer__social-link">
-            <svg class="fotter__icon">
+            <svg class="footer__icon">
               <use href="./img/footer/symbol-defs.svg#icon-youtube" width="40" height="40"></use>
           </svg>
           </a>

diff --git a/src/sass/components/footer.scss b/src/sass/components/footer.scss
@@ -18,7 +18,7 @@ body {
   color: $text-color;
 }
 
-.fotter__icon {
+.footer__icon {
   width: 40px;
   height: 40px;
   fill: #f6f5ef;
@@ -32,7 +32,7 @@ body {
 
 
 
-.fotter__icon__up {
+.footer__icon__up {
   width: 30px;
   height: 30px;
   fill: #f6f5ef;
@@ -41,8 +41,8 @@ body {
 
 .footer__up{
   display: flex;
-  justify-content: flex-end!important;
-  margin-right: 20px;
+  justify-content: flex-end;
+  // margin-left: 1100px;
 }
 
 .up__button {
@@ -196,13 +196,19 @@ body {
 }
 
 
+
 @media (min-width:768px) and (max-width:1219px) {
   .footer__menu {
     flex-direction: column;
     gap: 24px;
 
   }
 
+  .footer__up{
+    margin-left: 0px;
+    justify-content: flex-end;
+  }
+
   .decor__footer{
     top: 6300px;
   }
@@ -216,6 +222,10 @@ body {
     padding-left: 0px;
   }
 
+  .footer__up{
+    justify-content: flex-end;
+  }
+
   .footer__container {
     flex-direction: column;
     gap: 24px;