From 2701972548bb19aa4c63b1b69742fa520d360d98 Mon Sep 17 00:00:00 2001
From: Thomas Churchman <thomas@kepow.org>
Date: Fri, 5 Jan 2024 16:35:12 +0100
Subject: [PATCH] Increase size of kit avatar on Me kit list

---
 astroplant-frontend/src/Components/KitAvatar.tsx | 10 ++++++++--
 astroplant-frontend/src/scenes/Me/index.tsx      |  2 +-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/astroplant-frontend/src/Components/KitAvatar.tsx b/astroplant-frontend/src/Components/KitAvatar.tsx
index 2e5f9ad..796863e 100644
--- a/astroplant-frontend/src/Components/KitAvatar.tsx
+++ b/astroplant-frontend/src/Components/KitAvatar.tsx
@@ -4,7 +4,13 @@ import style from "./KitAvatar.module.css";
 
 /** A kit avatar generated from its serial. This is used for quick visual identification. */
 // TODO: maybe take an "identicon"-style approach.
-export function KitAvatar({ serial }: { serial: string }) {
+export function KitAvatar({
+  serial,
+  fontSize = "1rem",
+}: {
+  serial: string;
+  fontSize?: string;
+}) {
   const initials = useMemo(() => {
     if (serial.length === 16 && serial[0] === "k" && serial[1] === "-") {
       return (serial[2]! + serial[3]!).toUpperCase();
@@ -15,7 +21,7 @@ export function KitAvatar({ serial }: { serial: string }) {
     }
   }, [serial]);
   return (
-    <div className={style.avatar} aria-hidden="true">
+    <div className={style.avatar} aria-hidden="true" style={{ fontSize }}>
       {initials}
     </div>
   );
diff --git a/astroplant-frontend/src/scenes/Me/index.tsx b/astroplant-frontend/src/scenes/Me/index.tsx
index 0b7a557..94ef9b4 100644
--- a/astroplant-frontend/src/scenes/Me/index.tsx
+++ b/astroplant-frontend/src/scenes/Me/index.tsx
@@ -48,7 +48,7 @@ function Me({ me }: Props) {
                 const kitState = kitStates[serial];
                 return (
                   <li key={serial}>
-                    <KitAvatar serial={serial} />
+                    <KitAvatar serial={serial} fontSize="1.25rem" />
                     <div>
                       <header className={style.itemHeader}>
                         <Link to={`/kit/${serial}`}>