From a44135d550125f8ae1547775e76ddabd40c41b6c Mon Sep 17 00:00:00 2001
From: Gauthier Roebroeck <gauthier.roebroeck@gmail.com>
Date: Tue, 28 Jan 2025 12:02:59 +0800
Subject: [PATCH] fix(webui): adjust navigation drawer for better readability

---
 komga-webui/src/locales/en.json    |  5 ++---
 komga-webui/src/views/HomeView.vue | 23 +++++++++++++----------
 2 files changed, 15 insertions(+), 13 deletions(-)

diff --git a/komga-webui/src/locales/en.json b/komga-webui/src/locales/en.json
index 5a52063b71..3592ac7ca4 100644
--- a/komga-webui/src/locales/en.json
+++ b/komga-webui/src/locales/en.json
@@ -247,6 +247,7 @@
     "locale_name": "English",
     "locale_rtl": "false",
     "lock_all": "Lock all",
+    "media": "Media",
     "n_selected": "{count} selected",
     "nothing_to_show": "Nothing to show",
     "ok": "OK",
@@ -271,6 +272,7 @@
     "roles": "Roles",
     "save_changes": "Save changes",
     "series": "Series | Series",
+    "settings": "Settings",
     "sidecars": "Sidecars",
     "tags": "Tags",
     "unavailable": "Unavailable",
@@ -875,9 +877,6 @@
     "status": "Status",
     "url": "URL"
   },
-  "media_management": {
-    "title": "Media Management"
-  },
   "menu": {
     "add_to_collection": "Add to collection",
     "add_to_readlist": "Add to read list",
diff --git a/komga-webui/src/views/HomeView.vue b/komga-webui/src/views/HomeView.vue
index c2ad509e18..70fd47f0e7 100644
--- a/komga-webui/src/views/HomeView.vue
+++ b/komga-webui/src/views/HomeView.vue
@@ -52,7 +52,7 @@
 
       <v-divider/>
 
-      <v-list nav shaped>
+      <v-list nav shaped dense>
         <v-list-item :to="{name: 'dashboard'}">
           <v-list-item-icon>
             <v-icon>mdi-home</v-icon>
@@ -134,7 +134,7 @@
             </v-badge>
           </template>
           <template v-slot:activator>
-            <v-list-item-title>{{ $t('media_management.title') }}</v-list-item-title>
+            <v-list-item-title>{{ $t('common.media') }}</v-list-item-title>
           </template>
 
           <v-list-item :to="{name: 'media-analysis'}">
@@ -199,7 +199,7 @@
             </v-badge>
           </template>
           <template v-slot:activator>
-            <v-list-item-title>{{ $t('server_settings.server_settings') }}</v-list-item-title>
+            <v-list-item-title>{{ $t('server.tab_title') }}</v-list-item-title>
           </template>
 
           <v-list-item :to="{name: 'settings-users'}">
@@ -207,7 +207,7 @@
           </v-list-item>
 
           <v-list-item :to="{name: 'settings-server'}">
-            <v-list-item-title>{{ $t('server.tab_title') }}</v-list-item-title>
+            <v-list-item-title>{{ $t('common.settings') }}</v-list-item-title>
           </v-list-item>
 
           <v-list-item :to="{name: 'metrics'}">
@@ -271,27 +271,30 @@
 
       <v-divider/>
 
-      <v-list>
+      <v-list dense class="mt-2">
         <v-list-item>
           <v-list-item-icon>
             <v-icon>{{ themeIcon }}</v-icon>
           </v-list-item-icon>
           <v-select
+            class="py-2"
+            dense
             v-model="theme"
             :items="themes"
             :label="$t('home.theme')"
           ></v-select>
         </v-list-item>
-      </v-list>
 
-      <v-list>
         <v-list-item>
           <v-list-item-icon>
             <v-icon>mdi-translate</v-icon>
           </v-list-item-icon>
-          <v-select v-model="locale"
-                    :items="locales"
-                    :label="$t('home.translation')"
+          <v-select
+            dense
+            class="py-2"
+            v-model="locale"
+            :items="locales"
+            :label="$t('home.translation')"
           >
           </v-select>
         </v-list-item>