add amoozesh link to navbar on desktop

components/header/MobileMenu.vue

@@ -56,6 +56,13 @@
   <li tag="li">
     <a class="links" href="https://gps.asan-service.com/" target="_blank"> نرم افزار ردیاب </a>
   </li>
+  <nuxt-link
+  :to="{ name: 'download', query: { category: 'all', page: 1 } }"
+  :class="$route.name.includes('download') && 'active'"
+  tag="li"
+>
+    <a class="links"> دانلود </a>
+  </nuxt-link>
   <!-- <li tag="li">
     <a class="links" href="#"> آموزش </a>
   </li> -->

components/header/SiteHeader.vue

@@ -31,22 +31,25 @@
               </div>
             </li>
 
-            <li
+            <nuxt-link
-              class="dropDown-container help"
+              tag="li"
-              :class="helpDropDownActiveClass && 'active'"
+              :to="{ name: 'learning', query: { page: 1 } }"
-              @mouseenter="openDrop('help')"
+              :class="$route.name.includes('learning') && 'active'"
-              @mouseleave="closeDrop('help')"
             >
+              <a>آموزش</a>
+            </nuxt-link>
+
+            <li class="dropDown-container help" @mouseenter="openDrop('help')" @mouseleave="closeDrop('help')">
               <a>
                 <span>راهنما</span>
                 <i class="fas fa-angle-down"></i>
               </a>
               <div class="drop-down">
-                <nuxt-link
+                <!-- <nuxt-link
                   :to="{ name: 'learning', query: { page: 1 } }"
                   :class="$route.name.includes('learning') && 'active'"
                   >آموزش</nuxt-link
-                >
+                > -->
                 <nuxt-link :to="{ name: 'FAQ' }">سوالات متداول</nuxt-link>
               </div>
             </li>

sass/components/header.scss

@@ -53,7 +53,7 @@
     display: flex;
     justify-content: center;
     align-items: center;
-
+padding-right: 50px;
     li {
       margin: 0 10px;
 
@@ -169,4 +169,73 @@
       }
     }
   }
+
+
+   .dropDown-container {
+    position: relative;
+    cursor: pointer;
+
+    i {
+      display: inline-block;
+      @extend %defaultTransition;
+    }
+
+    &.d-active {
+      i {
+        @include transform(rotate(180deg));
+      }
+
+      .drop-down {
+        height: 113px;
+        border-top: 1px solid rgba(#fff, 0.1);
+      }
+
+      &.agents {
+        .drop-down {
+          height: 169px;
+        }
+      }
+      &.gps{
+        .drop-down {
+          height: 169px;
+        }
+      }
+      &.help{
+        .drop-down {
+          height: 65px !important;
+        }
+      }
+      &.contactus {
+        .drop-down {
+          height: 290px;
+        }
+      }
+    }
+
+    .drop-down {
+      position: absolute;
+      top: 65px;
+      right: -5px;
+      background: $theme;
+      min-width: 160px;
+      border-bottom-left-radius: 15px;
+      border-bottom-right-radius: 15px;
+      overflow: hidden;
+      height: 0;
+      @extend %defaultTransition;
+
+      a {
+        display: block;
+        padding: 15px 20px;
+
+        &:hover {
+          background: rgba(#fff, 0.05);
+        }
+
+        &.active {
+          background: rgba(#fff, 0.1);
+        }
+      }
+    }
+  }
 }