From 57aafb05387c8c26778a5b1bd83261b0daf1863e Mon Sep 17 00:00:00 2001
From: thepaperpilot <thepaperpilot@gmail.com>
Date: Wed, 22 Feb 2023 10:07:51 -0600
Subject: [PATCH] Add presence icon

---
 index.html                 |   1 +
 public/presence_v2.png     | Bin 0 -> 5126 bytes
 src/data/CharacterSlot.vue |  48 ++++++++++++++++++-------------------
 3 files changed, 25 insertions(+), 24 deletions(-)
 create mode 100644 public/presence_v2.png

diff --git a/index.html b/index.html
index 1a7f21e..b5dea4c 100644
--- a/index.html
+++ b/index.html
@@ -15,6 +15,7 @@
 		<link rel="stylesheet" media="screen" href="https://fontlibrary.org//face/dogica" type="text/css"/>
 
 		<link rel="prefetch" href="heart.png" />
+		<link rel="prefetch" href="presence_v2.png" />
 		<link rel="prefetch" href="Lvl 1_0.png" />
 		<link rel="prefetch" href="Lvl 1_1.png" />
 		<link rel="prefetch" href="Lvl 2_0.png" />
diff --git a/public/presence_v2.png b/public/presence_v2.png
new file mode 100644
index 0000000000000000000000000000000000000000..24fb95a125271ce131dd1c041a2caf503e23a6c4
GIT binary patch
literal 5126
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
LO+~o8RoMRlhYE@C

literal 0
HcmV?d00001

diff --git a/src/data/CharacterSlot.vue b/src/data/CharacterSlot.vue
index 3af7e43..dc7cc1a 100644
--- a/src/data/CharacterSlot.vue
+++ b/src/data/CharacterSlot.vue
@@ -68,7 +68,7 @@
                 <span>{{ character?.relevancy }}</span>
             </span>
             <span class="presence-display" v-if="character != null">
-                <span class="material-icons"> extension </span>
+                <img :src="star" />
                 <span>{{ character?.presence }}</span>
             </span>
             <span class="level-display" v-if="character != null">
@@ -93,6 +93,7 @@ import { Direction } from "util/common";
 import { coerceComponent } from "util/vue";
 import { Component, ref, shallowRef, watch, watchEffect } from "vue";
 import heart from "../../public/heart.png";
+import star from "../../public/presence_v2.png";
 import level1_0 from "../../public/Lvl 1_0.png";
 import level1_1 from "../../public/Lvl 1_1.png";
 import level2_0 from "../../public/Lvl 2_0.png";
@@ -214,23 +215,40 @@ watchEffect(() => {
     z-index: 100;
 }
 
-.relevancy-display {
+.relevancy-display,
+.presence-display {
     position: absolute;
     top: -15%;
-    left: 0;
     transform: translate(-50%, -50%);
 }
 
-.relevancy-display img {
+.relevancy-display {
+    left: 0;
+}
+
+.presence-display {
+    right: 0;
+}
+
+.relevancy-display img,
+.presence-display img {
     position: absolute;
-    transform: translate(-45%, -45%);
     z-index: -1;
     width: 10vmin;
     height: 10vmin;
     image-rendering: pixelated;
 }
 
-.relevancy-display span {
+.relevancy-display img {
+    transform: translate(-45%, -45%);
+}
+
+.presence-display img {
+    transform: translate(-50%, -50%);
+}
+
+.relevancy-display span,
+.presence-display span {
     font-size: 1.5vmin;
     color: white;
     text-shadow: -1px 1px 0 black, 1px 1px 0 black, 1px -1px 0 black, -1px -1px 0 black;
@@ -240,24 +258,6 @@ watchEffect(() => {
     transform: translate(-50%, -50%);
 }
 
-.presence-display {
-    position: absolute;
-    top: 0;
-    right: 0;
-    transform: translate(-50%, -50%);
-    color: var(--feature-foreground);
-}
-
-.presence-display .material-icons {
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    color: var(--accent1);
-    font-size: 2vmin;
-    z-index: -1;
-}
-
 .level-display {
     position: absolute;
     bottom: -5%;