zoom nav text if hover nav item

js/customElements/mainMenu.js

@@ -31,6 +31,7 @@ class MainMenu extends HTMLElement {
                 let a = document.createElement("a");
                 a.href = element["url"];
                 a.innerText = element["name"];
+                a.classList.add("navLink");
 
                 menuContainer.appendChild(a);
 
@@ -44,6 +45,7 @@ class MainMenu extends HTMLElement {
 
                 let a = document.createElement("a");
                 a.href = element["url"];
+                a.classList.add("navLink");
                 a.innerText = element["name"];
 
                 dropdown.appendChild(a)

scss/_menue.scss

@@ -6,7 +6,6 @@
     align-content: flex-end;
     justify-content: flex-end;
     width: 100%;
-
     a {
         color: white;
         text-align: center;
@@ -27,34 +26,39 @@
     width: max-content;
     left: 50%;
     transform: translateX(-50%);
-
     a {
         background-color: $back-color-3;
         border-bottom: $back-color-2 solid 2px;
         width: 100%;
         color: $text-color;
         transition: background-color $link-hover-animation-time linear;
-
         &:first-of-type {
             border-top-left-radius: $border-radius-sub-nav;
             border-top-right-radius: $border-radius-sub-nav;
         }
-
         &:last-of-type {
             border-bottom: none;
             border-bottom-left-radius: $border-radius-sub-nav;
             border-bottom-right-radius: $border-radius-sub-nav;
         }
-
         &:hover {
             background-color: $back-color-2;
         }
     }
 }
 
-.dropdown:hover .dropdown-content {
+.navLink:hover {
+    transform: scale(1.2);
+}
+
+.dropdown:hover {
+    .navLink {
+        transform: scale(1.2);
+    }
+    .dropdown-content {
         display: block;
     }
+}
 
 .menueSelected {
     text-decoration: underline !important;