From 8239781550989035d16b29e77bfd7f8e3b64d1b7 Mon Sep 17 00:00:00 2001
From: tomholford <tomholford@users.noreply.github.com>
Date: Tue, 29 Nov 2022 05:31:16 -0800
Subject: [PATCH] grid: fix tile bullet + suspend notice layout

---
 pkg/grid/src/nav/notifications/SystemNotification.tsx | 2 +-
 pkg/grid/src/tiles/Tile.tsx                           | 7 ++++---
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/pkg/grid/src/nav/notifications/SystemNotification.tsx b/pkg/grid/src/nav/notifications/SystemNotification.tsx
index 3141e9cd18..7a4bbc69e0 100644
--- a/pkg/grid/src/nav/notifications/SystemNotification.tsx
+++ b/pkg/grid/src/nav/notifications/SystemNotification.tsx
@@ -98,7 +98,7 @@ export const BaseBlockedNotification = () => {
           >
             <h2 className="h4">Skip System Update</h2>
             <p>
-              Skipping the application fo an incoming System Update will grant you the ability to
+              Skipping the application for an incoming System Update will grant you the ability to
               continue using incompatible apps at the cost of an urbit that&apos;s not up to date.
             </p>
             <p>
diff --git a/pkg/grid/src/tiles/Tile.tsx b/pkg/grid/src/tiles/Tile.tsx
index 52fd1b9e5b..bc2bfe86ce 100644
--- a/pkg/grid/src/tiles/Tile.tsx
+++ b/pkg/grid/src/tiles/Tile.tsx
@@ -26,6 +26,7 @@ export const Tile: FunctionComponent<TileProps> = ({ charge, desk, disabled = fa
   const loading = !disabled && 'install' in chad;
   const suspended = disabled || 'suspend' in chad;
   const hung = 'hung' in chad;
+  // TODO should held zest be considered inactive? suspended? also, null sync?
   const active = !disabled && chadIsRunning(chad);
   const link = getAppHref(href);
   const backgroundColor = suspended ? suspendColor : active ? tileColor || 'purple' : suspendColor;
@@ -56,6 +57,9 @@ export const Tile: FunctionComponent<TileProps> = ({ charge, desk, disabled = fa
     >
       <div>
         <div className="absolute z-10 top-4 left-4 sm:top-6 sm:left-6 flex items-center">
+          {pike?.zest === 'held' && !disabled && (
+            <Bullet className="w-4 h-4 text-orange-500 dark:text-black" />
+          )}
           {!active && (
             <>
               {loading && <Spinner className="h-6 w-6 mr-2" />}
@@ -65,9 +69,6 @@ export const Tile: FunctionComponent<TileProps> = ({ charge, desk, disabled = fa
             </>
           )}
         </div>
-        {pike?.zest === 'held' && !disabled && (
-          <Bullet className="absolute z-10 top-5 left-5 sm:top-7 sm:left-7 w-4 h-4 text-orange-500 dark:text-black" />
-        )}
         <TileMenu
           desk={desk}
           chad={chad}