From f04cb69726efef1ef72df6e33ebfd1946116170f Mon Sep 17 00:00:00 2001
From: thepaperpilot <thepaperpilot@gmail.com>
Date: Sat, 23 Apr 2022 14:48:25 -0500
Subject: [PATCH] Show pin on pinned tooltips

---
 src/data/themes.ts                |  4 +++-
 src/features/tooltips/Tooltip.vue | 15 ++++++++++++++-
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/src/data/themes.ts b/src/data/themes.ts
index 37b563f..148114e 100644
--- a/src/data/themes.ts
+++ b/src/data/themes.ts
@@ -23,6 +23,7 @@ export interface Theme {
     variables: ThemeVars;
     floatingTabs: boolean;
     mergeAdjacent: boolean;
+    showPin: boolean;
 }
 
 declare module "@vue/runtime-dom" {
@@ -53,7 +54,8 @@ const defaultTheme: Theme = {
         "--feature-margin": "0px"
     },
     floatingTabs: true,
-    mergeAdjacent: true
+    mergeAdjacent: true,
+    showPin: true
 };
 
 export enum Themes {
diff --git a/src/features/tooltips/Tooltip.vue b/src/features/tooltips/Tooltip.vue
index 68f946f..133c139 100644
--- a/src/features/tooltips/Tooltip.vue
+++ b/src/features/tooltips/Tooltip.vue
@@ -24,6 +24,7 @@
                     '--yoffset': unref(yoffset) || '0px'
                 }"
             >
+                <span v-if="showPin" class="material-icons pinned">push_pin</span>
                 <component v-if="comp" :is="comp" />
             </div>
         </transition>
@@ -31,8 +32,10 @@
 </template>
 
 <script lang="ts">
+import themes from "data/themes";
 import { CoercableComponent, jsx, StyleValue } from "features/feature";
 import { Persistent } from "game/persistence";
+import settings from "game/settings";
 import {
     coerceComponent,
     computeOptionalComponent,
@@ -93,6 +96,8 @@ export default defineComponent({
             }
         }
 
+        const showPin = computed(() => unwrapRef(pinned) && themes[settings.theme].showPin);
+
         return {
             TooltipDirection,
             isHovered,
@@ -100,7 +105,8 @@ export default defineComponent({
             comp,
             elementComp,
             unref,
-            togglePinned
+            togglePinned,
+            showPin
         };
     }
 });
@@ -210,4 +216,11 @@ export default defineComponent({
     margin-top: -10px;
     border-color: transparent transparent var(--tooltip-background) transparent;
 }
+
+.pinned {
+    position: absolute;
+    right: -5px;
+    top: -5px;
+    transform: rotateZ(45deg);
+}
 </style>