chore(ui): harmonize navbar

src/app/post/components/post-header/post-header.component.html

@@ -8,7 +8,7 @@
     <nav>
       <span
         *ngFor="let tag of tags.others"
-        class="btnTag"
+        class="tag"
         tabindex="0"
         role="listitem"
         [ngClass]="{ active: tag.slug === mainActiveTag.slug || tag.name === mainActiveTag.slug }"

src/app/post/components/post-header/post-header.component.scss

@@ -25,15 +25,16 @@ header {
   nav {
     display: flex;
     overflow-x: auto;
-    .btnTag {
+    white-space: nowrap;
+    .tag {
+      cursor: pointer;
+      user-select: none;
+      @include font-regular-14;
+      box-sizing: border-box;
       padding: 0 16px;
       height: 60px;
-      @include font-regular-14;
       display: flex;
       align-items: center;
-      cursor: pointer;
-      user-select: none;
-      white-space: nowrap;
       border-bottom: 3px solid transparent;
       transition: all 0.3s ease-in-out;
       &.active {

src/app/profile/edit/edit.component.scss

@@ -61,17 +61,24 @@
     border-bottom: 1px solid $grey-5;
 
     .tab {
-      padding-bottom: 1rem;
-      justify-content: center;
+      cursor: pointer;
+      user-select: none;
+      @include font-regular-14;
+      box-sizing: border-box;
+      padding: 0 16px;
+      height: 60px;
       display: flex;
+      justify-content: center;
+      align-items: center;
       flex: 1;
-      user-select: none;
+      border-bottom: 3px solid transparent;
+      transition: all 0.3s ease-in-out;
       &:hover {
-        cursor: pointer;
+        border-color: $grey-4;
       }
       &.selected {
         font-weight: bold;
-        border-bottom: 2px solid $grey-1;
+        border-color: $grey-1;
       }
     }
   }

src/app/profile/personal-offer-edition/personal-offer-edition.component.scss

@@ -65,21 +65,27 @@
     justify-content: flex-start;
     overflow-x: auto;
     white-space: nowrap;
-
     border-bottom: 1px solid $grey-5;
 
     .tab {
-      padding-bottom: 1rem;
-      justify-content: center;
+      cursor: pointer;
+      user-select: none;
+      @include font-regular-14;
+      box-sizing: border-box;
+      padding: 0 16px;
+      height: 60px;
       display: flex;
+      justify-content: center;
+      align-items: center;
       flex: 1;
-      user-select: none;
+      border-bottom: 3px solid transparent;
+      transition: all 0.3s ease-in-out;
       &:hover {
-        cursor: pointer;
+        border-color: $grey-4;
       }
       &.selected {
         font-weight: bold;
-        border-bottom: 2px solid $grey-1;
+        border-color: $grey-1;
       }
     }
   }