fix header

components/header/SiteHeader.vue

@@ -2,12 +2,12 @@
   <header class="site--header">
     <div class="container-fluid">
       <div class="row">
-        <nav class="col-6 col-lg-2 logo">
+        <nav class="col-6 col-sw-2 logo">
           <nuxt-link :to="{ name: 'index' }">
             <logo />
           </nuxt-link>
         </nav>
-        <nav class="col-8 d-none d-lg-block">
+        <nav class="col-8 d-none d-sw-block">
           <ul class="links">
             <nuxt-link :to="{ name: 'announcements' }" tag="li">
               <a>اطلاعیه ها </a>
@@ -101,7 +101,7 @@
           
           </ul>
         </nav>
-        <nav class="col-2 d-none d-lg-flex account">
+        <nav class="col-2 d-none d-sw-flex account">
           <nuxt-link :to="isUser ? { name: 'account' } : { name: 'auth-login-register' }">
             <span v-if="isUser" class="singleLineTxt" :title="fullName">{{ fullName }}</span>
             <span v-else>ورود</span>
@@ -109,7 +109,7 @@
             <i v-else class="fal fa-user"></i>
           </nuxt-link>
         </nav>
-        <div class="col-6 d-flex d-lg-none align-items-center justify-content-end menu">
+        <div class="col-6 d-flex d-sw-none align-items-center justify-content-end menu">
           <i id="menu" class="far" :class="!mobileMenu ? 'fa-bars' : 'fa-chevron-left'"></i>
         </div>
       </div>

sass/components/header.scss

@@ -6,6 +6,22 @@
   left: 0;
   z-index: 11;
 
+  @media (min-width: 1200px){
+    .d-sw-block{
+      display: block !important;
+     }
+     .d-sw-flex{
+      display: flex !important;
+     }
+     .d-sw-none{
+      display: none !important;
+     }
+     .col-sw-2 {
+      flex: 0 0 auto;
+      width: 16.6666666667%;
+  }
+  }
+ 
   a {
     color: #fff;
     display: inline-block;
@@ -36,10 +52,11 @@
   .links {
     display: flex;
     justify-content: center;
+    align-items: center;
 
     li {
       margin: 0 10px;
-      border-bottom: 2px solid transparent;
+
       @extend %defaultTransition;
 
       a {
@@ -48,11 +65,13 @@
         @media (max-width: 1420px) {
           font-size: 14px;
           padding: 21px 8px;
+          white-space: nowrap;
         }
 
         @media (max-width: 1120px) {
           font-size: 14px;
           padding: 21px 4px;
+          white-space: nowrap;
         }
       }
 
@@ -131,7 +150,6 @@
       min-width: 160px;
       border-bottom-left-radius: 15px;
       border-bottom-right-radius: 15px;
-      border-top: 1px solid transparent;
       overflow: hidden;
       height: 0;
       @extend %defaultTransition;