fix(webui): adjust navigation drawer for better readability

gotson · Jan 28, 2025 · a44135d · a44135d
1 parent c4a4278
commit a44135d
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 13 deletions.
diff --git 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
@@ -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,15 +199,15 @@
             </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'}">
             <v-list-item-title>{{ $t('users.users') }}</v-list-item-title>
           </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>