From d624e9df32c46d239a9b437d21d15f47dd999138 Mon Sep 17 00:00:00 2001
From: SethBurkart123 <seth.burkart@hills.adventist.edu.au>
Date: Fri, 4 Oct 2024 12:24:36 +1000
Subject: [PATCH] fix: icon fonts not loading in inputs

---
 src/resources/fonts/style.css                  | 4 ++++
 src/svelte-interface/pages/themeCreator.svelte | 4 ++--
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/resources/fonts/style.css b/src/resources/fonts/style.css
index f5f3cfcd..0078ed19 100644
--- a/src/resources/fonts/style.css
+++ b/src/resources/fonts/style.css
@@ -9,6 +9,10 @@
   font-display: block;
 }
 
+input.unitRight {
+  font-family: 'icomoon';
+}
+
 [class^="icon-"], [class*=" icon-"] {
   /* use !important to prevent issues with browser extensions that change fonts */
   font-family: 'icomoon' !important;
diff --git a/src/svelte-interface/pages/themeCreator.svelte b/src/svelte-interface/pages/themeCreator.svelte
index cb9c858c..7ac4b59f 100644
--- a/src/svelte-interface/pages/themeCreator.svelte
+++ b/src/svelte-interface/pages/themeCreator.svelte
@@ -181,8 +181,8 @@
     {/each}
 
     <div class="relative flex justify-center w-full gap-1 overflow-hidden transition rounded-lg aspect-theme group place-items-center bg-zinc-100 dark:bg-zinc-900">
-      <div class={`transition pointer-events-none z-30 ${ theme.coverImage ? 'opacity-0 group-hover:opacity-100' : ''}`}>
-        \ueb44
+      <div class={`transition pointer-events-none z-30 font-IconFamily ${ theme.coverImage ? 'opacity-0 group-hover:opacity-100' : ''}`}>
+        {'\ueb44'}
       </div>
       <span class={`dark:text-white pointer-events-none z-30 transition ${ theme.coverImage ? 'opacity-0 group-hover:opacity-100' : ''}`}>{theme.coverImage ? 'Change' : 'Add'} cover image</span>
       <input type="file" accept='image/*' onchange={onCoverImageUpload} class="absolute inset-0 z-10 w-full h-full opacity-0 cursor-pointer" />