From 985fa2f7c99832cdf3c3351d2273c8fd05402b78 Mon Sep 17 00:00:00 2001
From: polwex <polwex@sortug.com>
Date: Wed, 17 Sep 2025 21:45:18 +0700
Subject: basic comms working

---
 front/src/components/Sigil.tsx | 20 ++++++++++----------
 1 file changed, 10 insertions(+), 10 deletions(-)

(limited to 'front/src/components/Sigil.tsx')

diff --git a/front/src/components/Sigil.tsx b/front/src/components/Sigil.tsx
index 4978a72..cbc2e57 100644
--- a/front/src/components/Sigil.tsx
+++ b/front/src/components/Sigil.tsx
@@ -1,4 +1,4 @@
-import comet from "@/assets/icons/comet.svg";
+import Icon from "@/components/Icon";
 import { auraToHex } from "@/logic/utils";
 import { isValidPatp } from "urbit-ob";
 import { sigil } from "urbit-sigils";
@@ -7,19 +7,19 @@ import { reactRenderer } from "urbit-sigils";
 interface SigilProps {
   patp: string;
   size: number;
-  color?: string;
+  bg?: string;
+  fg?: string;
 }
 
 const Sigil = (props: SigilProps) => {
-  const color = props.color ? auraToHex(props.color) : "black";
-  if (!isValidPatp(props.patp)) return <div className="sigil bad-sigil">X</div>;
-  else if (props.patp.length > 28)
+  const bg = props.bg ? auraToHex(props.bg) : "var(--color-background)";
+  const fg = props.fg ? auraToHex(props.fg) : "var(--color-primary)";
+  if (props.patp.length > 28)
     return (
-      <img
+      <Icon
+        name="comet"
+        size={props.size}
         className="comet-icon"
-        src={comet}
-        alt=""
-        style={{ width: `${props.size}px`, height: `${props.size}px` }}
       />
     );
   else if (props.patp.length > 15)
@@ -41,7 +41,7 @@ const Sigil = (props: SigilProps) => {
           patp: props.patp,
           renderer: reactRenderer,
           size: props.size,
-          colors: [color, "white"],
+          colors: [bg, fg],
         })}
       </>
     );
-- 
cgit v1.2.3