Client - improve language dropdown display

fittrackee_client/src/components/Common/Dropdown.vue

@@ -54,7 +54,7 @@
   .dropdown-list {
     list-style-type: none;
     background-color: #ffffff;
-    padding: 0;
+    padding: 0 !important;
     margin-top: 5px;
     margin-left: -20px !important;
     position: absolute;
@@ -64,16 +64,12 @@
     width: auto !important;
 
     li {
-      padding-top: 5px;
-      padding-right: 5px;
-    }
-    li:last-child {
-      padding-bottom: 5px;
+      padding: 3px 8px;
     }
   }
 
   .dropdown-item {
-    cursor: default;
+    cursor: pointer;
 
     &.selected {
       font-weight: bold;
@@ -82,5 +78,9 @@
     &.selected::after {
       content: ' ✔';
     }
+
+    &:hover {
+      background-color: var(--dropdown-hover-color);
+    }
   }
 </style>

fittrackee_client/src/components/NavBar.vue

@@ -197,14 +197,10 @@
       .nav-item {
         padding: 0 10px;
 
-        &.dropdown-wrapper {
-          width: 60px;
-        }
-
         ::v-deep(.dropdown-list) {
-          margin-left: -10px;
-          padding-left: 10px;
-          width: 75px;
+          padding-left: $default-padding;
+          padding-right: $default-padding;
+          right: $default-padding;
         }
       }
 
@@ -294,6 +290,11 @@
 
         .nav-item {
           padding: 7px 25px;
+
+          ::v-deep(.dropdown-list) {
+            right: initial;
+            left: 45px;
+          }
         }
 
         .nav-profile-img {