From dbf7b3e28ed25f4617a55883eed46e6fb18f2d58 Mon Sep 17 00:00:00 2001
From: rijkvanzanten <rijkvanzanten@me.com>
Date: Fri, 4 Sep 2020 17:27:12 -0400
Subject: [PATCH] Only show bookmark scope on hover

---
 app/src/modules/collections/components/navigation.vue | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/app/src/modules/collections/components/navigation.vue b/app/src/modules/collections/components/navigation.vue
index f75048762a..811f605c44 100644
--- a/app/src/modules/collections/components/navigation.vue
+++ b/app/src/modules/collections/components/navigation.vue
@@ -19,7 +19,7 @@
 		<template v-if="bookmarks.length > 0">
 			<v-divider />
 
-			<v-list-item exact v-for="bookmark in bookmarks" :key="bookmark.id" :to="bookmark.to">
+			<v-list-item exact v-for="bookmark in bookmarks" :key="bookmark.id" :to="bookmark.to" class="bookmark">
 				<v-list-item-icon><v-icon name="bookmark" /></v-list-item-icon>
 				<v-list-item-content>{{ bookmark.title }}</v-list-item-content>
 				<v-list-item-icon v-if="bookmark.scope !== 'user'" class="bookmark-scope">
@@ -101,5 +101,12 @@ export default defineComponent({
 
 .bookmark-scope {
 	--v-icon-color: var(--foreground-subdued);
+
+	opacity: 0;
+	transition: opacity var(--fast) var(--transition);
+}
+
+.bookmark:hover .bookmark-scope {
+	opacity: 1;
 }
 </style>