Make entire infobar clickable

src/App.vue

@@ -193,13 +193,12 @@ const privacyLink = computed(() => {
   <div id="page">
     <icon v-show="updateInProgress" icon="spinner" spin
       class="position-fixed bottom-0 start-0 m-1 opacity-25 text-muted" />
-    <header v-if="config?.showInfobar" class="secret-hover">
-      <InfoBar :config="config">
-        <span class="text-muted float-end opacity-50 secret">
-          <icon icon="gear" style="cursor: pointer" title="Edit Settings" data-bs-toggle="modal"
-            data-bs-target="#configModal" />
-        </span>
-      </InfoBar>
+    <header v-if="config?.showInfobar" class="secret-hover" style="cursor: context-menu" data-bs-toggle="modal"
+      data-bs-target="#configModal" title="Click to edit wall settings">
+      <span class="text-muted float-end secret">
+        <icon icon="gear" />
+      </span>
+      <InfoBar :config="config" />
     </header>
 
     <main>
@@ -265,11 +264,12 @@ body {
 }
 
 .secret-hover .secret {
-  visibility: hidden;
+  transition: opacity 0.2s;
+  opacity: 0;
 }
 
 .secret-hover:hover .secret {
-  visibility: visible;
+  opacity: 1;
 }
 
 #page header {

src/components/InfoBar.vue

@@ -27,9 +27,6 @@ defineProps<{
                 <template v-else-if="index == config.accounts.length - 2"> or </template>
             </template>
         </template>
-
-        <slot></slot>
-
     </div>
 </template>