Fix CSS bugs in updated nav bar (#2479)

Author: julianguyen

app/assets/stylesheets/base/_sizes.scss

@@ -12,6 +12,7 @@ $size-18: 18px;
 $size-20: 20px;
 $size-22: 22px;
 $size-24: 24px;
+$size-25: 25px;
 $size-26: 26px;
 $size-28: 28px;
 $size-30: 30px;

app/assets/stylesheets/dashboard/dashboard_content.scss

@@ -1,7 +1,7 @@
 .dashboardContent {
   width: 100%;
   box-sizing: border-box;
-  padding: $size-0 25px 50px 25px;
+  padding: $size-25 $size-25 $size-50 $size-25;
   display: flex;
   flex-direction: row;
   margin-top: $nav-height;

app/assets/stylesheets/secret_share/secret_share_content.scss

@@ -1,7 +1,7 @@
 .secretShareContent {
   width: 100%;
   box-sizing: border-box;
-  padding: 50px 25px;
+  padding: $size-50 $size-25;
   background: $white-80;
   margin-top: $nav-height;
 

client/app/components/Header/Header.scss

@@ -1,5 +1,11 @@
 @import "~styles/_global";
 
+@mixin hideOnMobile {
+  @media screen and (max-width: $medium) {
+    display: none;
+  }
+}
+
 @mixin linkStyle() {
   a {
     @include standardTransition;
@@ -40,9 +46,7 @@
   }
 
   &HideInMobile {
-    @media screen and (max-width: $medium) {
-      display: none;
-    }
+    @include hideOnMobile;
   }
 
   &Hamburger {
@@ -58,22 +62,19 @@
   }
 
   &Locale {
-    @include setMargin($size-0, $size-0, $size-0, $size-26);
+    @include setMargin($size-0, $size-0, $size-0, $size-25);
 
     display: flex;
     align-items: center;
-
-    @media screen and (max-width: $medium) {
-      display: none;
-    }
+    @include hideOnMobile;
 
     select {
       @include setPadding($size-12, $size-0, $size-12, $size-24);
     }
   }
 
   &MobileLocale {
-    @include setMargin($size-20, $size-0, $size-0, $size-0);
+    @include setMargin($size-20, $size-0, $size-20, $size-0);
 
     display: flex;
     justify-content: center;
@@ -129,7 +130,7 @@
 
   &Desktop {
     width: 100%;
-    padding: 25px $size-34;
+    padding: $size-25 $size-34;
     box-sizing: border-box;
     margin-bottom: auto;
     display: flex;
@@ -171,9 +172,7 @@
           @include setMargin($size-0, $size-0, $size-0, $size-0);
         }
 
-        @media screen and (max-width: $medium) {
-          display: none;
-        }
+        @include hideOnMobile;
       }
     }
   }

client/app/components/Resource/Resource.scss

@@ -3,7 +3,7 @@
 .resource {
   position: relative;
   width: 100%;
-  padding: 25px $size-10;
+  padding: $size-25 $size-10;
 
   &::before {
     content: '';