refactor:refactor swutch-language tag from a to button

mate-academy · Oct 23, 2024 · 5aac521 · 5aac521
1 parent d0964ca
commit 5aac521
Show file tree

Hide file tree

Showing 6 changed files with 39 additions and 12 deletions.
diff --git a/src/index.html b/src/index.html
@@ -37,13 +37,10 @@
               href="#menu"
               class="icon header__icon icon-menu"
             ></a>
-            <a
-              href="#"
-              class="header__switch-language"
-            >
+            <button class="header__switch-language">
               UA
               <span class="icon header__icon-dropdown icon-dropdown"></span>
-            </a>
+            </button>
           </div>
         </div>
 
@@ -80,13 +77,10 @@ <h6 class="header__date-desctop">10.08 - 10.10</h6>
           ></a>
 
           <div class="menu__icons">
-            <a
-              href="#"
-              class="menu__switch-language"
-            >
+            <button class="menu__switch-language">
               UA
               <span class="icon menu__icon-dropdown icon-dropdown"></span>
-            </a>
+            </button>
 
             <a
               href="#"

diff --git a/src/styles/base/_base.scss b/src/styles/base/_base.scss
@@ -55,3 +55,10 @@ textarea {
 textarea {
   resize: none;
 }
+
+button {
+  background: none;
+  border: none;
+  outline: none;
+  transition: $transition-time ease-in-out;
+}
diff --git a/src/styles/components/_header.scss b/src/styles/components/_header.scss
@@ -61,6 +61,9 @@
     column-gap: 0.5rem;
     display: none;
 
+    @include font(1.6rem, 2.4rem, 400);
+    @extend %font-raleway;
+
     @include media-tablet {
       display: flex;
     }

diff --git a/src/styles/components/_menu.scss b/src/styles/components/_menu.scss
@@ -66,6 +66,10 @@
 
   &__switch-language {
     column-gap: 0.5rem;
+
+    @include font(1.6rem, 2.4rem, 400);
+    @extend %font-raleway;
+
     &:hover {
       color: $color-main;
       > .icon {

diff --git a/src/styles/style.css b/src/styles/style.css