feat(SW-272) link style changes

components/Header/MainMenu/NavigationMenu/MegaMenu/megaMenu.module.css

@@ -13,8 +13,10 @@
 .submenus {
   list-style: none;
   display: grid;
-  gap: var(--Spacing-x3);
-  padding: var(--Spacing-x2) var(--Spacing-x4);
+}
+
+.submenuTitle {
+  padding-left: var(--Spacing-x1);
 }
 
 .submenu {
@@ -31,10 +33,16 @@
   align-content: start;
 }
 
-.link {
-  padding: var(--Spacing-x1) 0;
-  font-weight: var(--typography-Body-Bold-fontWeight);
-  width: 100%;
+.linkIcon {
+  display: none;
+}
+
+.link:not(:hover) .arrow {
+  opacity: 0;
+}
+
+.arrow {
+  flex-shrink: 0;
 }
 
 .backWrapper {
@@ -68,10 +76,17 @@
     grid-template-rows: max-content 1fr max-content;
   }
 
+  .submenus {
+    padding: var(--Spacing-x2);
+  }
+
   .submenusItem:first-child {
     padding-bottom: var(--Spacing-x2);
     border-bottom: 1px solid var(--Primary-Light-On-Surface-Divider-subtle);
   }
+  .submenusItem:last-child {
+    padding-top: var(--Spacing-x3);
+  }
 
   .cardWrapper {
     background-color: var(--Base-Surface-Secondary-light-Normal);
@@ -104,11 +119,16 @@
   .submenus {
     grid-area: submenus;
     grid-template-columns: repeat(2, 1fr);
+    padding: var(--Spacing-x2) var(--Spacing-x3);
   }
 
   .submenusItem:first-child {
+    padding-right: var(--Spacing-x5);
     border-right: 1px solid var(--Primary-Light-On-Surface-Divider-subtle);
   }
+  .submenusItem:last-child {
+    padding-left: var(--Spacing-x5);
+  }
 
   .cardWrapper {
     grid-area: card;