Add external links in nav, tweak line height

src/components/v-list/v-list-item-content.vue

@@ -32,7 +32,7 @@ body {
 			flex-basis: 100%;
 			flex-grow: 1;
 			flex-shrink: 0;
-			line-height: 1;
+			line-height: 1.4;
 
 			&:not(:last-child) {
 				margin-bottom: 2px;

src/lang/en-US/index.json

@@ -239,6 +239,9 @@
 	"disabled": "Disabled",
 	"information": "Information",
 
+	"report_bug": "Report Bug",
+	"request_feature": "Request Feature",
+
 	"interface_not_found": "Interface \"{interface}\" not found",
 
 	"item_count": "No Items | One Item | {count} Items",
@@ -961,7 +964,6 @@
   "remove": "Remove",
   "remove_related": "Remove Related Item",
   "report_issue": "Report Issue",
-  "request_feature": "Request Feature",
   "reset": "Reset",
   "reset_password": "Reset Password",
   "reset_preferences": "Reset all listing preferences",

src/modules/settings/components/navigation/navigation.vue

@@ -6,6 +6,15 @@
 				<v-list-item-title>{{ item.name }}</v-list-item-title>
 			</v-list-item-content>
 		</v-list-item>
+
+		<v-divider />
+
+		<v-list-item v-for="item in externalItems" :href="item.href" :key="item.href">
+			<v-list-item-icon><v-icon :name="item.icon" /></v-list-item-icon>
+			<v-list-item-content>
+				<v-list-item-title>{{ item.name }}</v-list-item-title>
+			</v-list-item-content>
+		</v-list-item>
 	</v-list>
 </template>
 
@@ -47,7 +56,20 @@ export default defineComponent({
 			},
 		];
 
-		return { navItems };
+		const externalItems = [
+			{
+				icon: 'bug_report',
+				name: i18n.t('report_bug'),
+				href: 'https://github.com/directus/app/issues/new?template=bug_report.md',
+			},
+			{
+				icon: 'new_releases',
+				name: i18n.t('request_feature'),
+				href: 'https://github.com/directus/directus/discussions/new',
+			},
+		];
+
+		return { navItems, externalItems };
 	},
 });
 </script>