Improved tooltip behavior and styling.

assets/components/header/header.vue

@@ -95,14 +95,17 @@
 				<template v-slot:tooltip>
 					<div class="menu">
 						<ul class="menu-items noselect">
-							<li class="menu-item disabled">
+							<li
+								class="menu-item disabled"
+								@click.stop
+							>
 								<Icon icon="enter2" />Sign in
 							</li>
 
 							<li
 								v-show="!sfw"
 								class="menu-item"
-								@click="setSfw(true)"
+								@click.stop="setSfw(true)"
 							>
 								<Icon
 									icon="flower"
@@ -113,7 +116,7 @@
 							<li
 								v-show="sfw"
 								class="menu-item"
-								@click="setSfw(false)"
+								@click.stop="setSfw(false)"
 							>
 								<Icon
 									icon="fire"
@@ -124,7 +127,7 @@
 							<li
 								v-show="theme === 'light'"
 								class="menu-item"
-								@click="setTheme('dark')"
+								@click.stop="setTheme('dark')"
 							>
 								<Icon
 									icon="moon"
@@ -135,7 +138,7 @@
 							<li
 								v-show="theme === 'dark'"
 								class="menu-item"
-								@click="setTheme('light')"
+								@click.stop="setTheme('light')"
 							>
 								<Icon
 									icon="sun"
@@ -143,7 +146,10 @@
 								/>Light theme
 							</li>
 
-							<li class="menu-item">
+							<li
+								class="menu-item disabled"
+								@click.stop
+							>
 								<Icon icon="filter" />Filters
 							</li>
 						</ul>