By @dpschen fix: move logo color definition to logo.vue

src/components/home/Logo.vue

@@ -7,5 +7,11 @@ const Logo = computed(() => new Date().getMonth() === 5 ? LogoFullPride : LogoFu
 </script>
 
 <template>
-	<Logo alt="Vikunja" />
-</template>
+	<Logo alt="Vikunja" class="logo" />
+</template>
+
+<style lang="scss" scoped>
+.logo {
+	color: var(--logo-text-color);
+}
+</style>

src/components/home/topNavigation.vue

@@ -5,7 +5,7 @@
 		class="navbar main-theme is-fixed-top"
 		role="navigation"
 	>
-		<router-link :to="{name: 'home'}" class="navbar-item logo">
+		<router-link :to="{name: 'home'}" class="logo-link">
 			<Logo width="164" height="48"/>
 		</router-link>
 		<MenuButton class="menu-button"/>
@@ -142,14 +142,9 @@ $vikunja-nav-logo-full-width: 164px;
 	z-index: 4 !important;
 }
 
-.logo {
+.logo-link {
 	display: none;
-	color: var(--logo-text-color);
-
-  &:hover, &:focus {
-		background-color: transparent;
-		color: var(--primary);
-	}
+	padding: 0.5rem 0.75rem;
 
 	@media screen and (min-width: $tablet) {
 		align-self: stretch;

src/components/misc/no-auth-wrapper.vue

@@ -36,8 +36,4 @@ const motd = computed(() => store.state.config.motd)
 	margin: 0 auto;
 	padding: 1rem;
 }
-
-.logo {
-	color: var(--logo-text-color);
-}
 </style>