From cdf370bd406384b65e63926042bbb05f584d35ea Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Thu, 20 Jun 2024 13:18:41 -0400
Subject: [PATCH] refactor: subtle ui tweaks

---
 src/components/AccountNotifications.tsx       |  3 +-
 src/components/NotificationRow.tsx            |  2 +-
 src/components/RepositoryNotifications.tsx    |  6 +--
 .../AccountNotifications.test.tsx.snap        | 35 +++++--------
 .../NotificationRow.test.tsx.snap             |  4 +-
 .../RepositoryNotifications.test.tsx.snap     | 52 +++++++++----------
 6 files changed, 46 insertions(+), 56 deletions(-)
diff --git a/src/components/AccountNotifications.tsx b/src/components/AccountNotifications.tsx
index 9febd6c6f..8eda15d1d 100644
--- a/src/components/AccountNotifications.tsx
+++ b/src/components/AccountNotifications.tsx
@@ -68,7 +68,7 @@ export const AccountNotifications: FC<IAccountNotifications> = (
       {showAccountHostname && (
         <div
           className={cn(
-            'group flex items-center justify-between px-3 py-2 text-sm font-semibold',
+            'group flex items-center justify-between px-3 py-1.5 text-sm font-semibold',
             'bg-gray-300 dark:bg-gray-darkest dark:text-white',
             Opacity.LOW,
           )}
@@ -84,7 +84,6 @@ export const AccountNotifications: FC<IAccountNotifications> = (
                 event.stopPropagation();
                 openAccountProfile(account);
               }}
-              className="opacity-80"
             >
               @{account.user.login}
             </button>
diff --git a/src/components/NotificationRow.tsx b/src/components/NotificationRow.tsx
index 4fe7e897b..e3c715b21 100644
--- a/src/components/NotificationRow.tsx
+++ b/src/components/NotificationRow.tsx
@@ -140,7 +140,7 @@ export const NotificationRow: FC<INotificationRow> = ({
         {groupByDate && (
           <div
             className={cn(
-              'mb-1 flex items-center gap-1 text-xs',
+              'mb-1 flex items-center gap-1 text-xs font-medium',
               Opacity.MEDIUM,
             )}
             title={repoSlug}
diff --git a/src/components/RepositoryNotifications.tsx b/src/components/RepositoryNotifications.tsx
index 12a86a49f..7ea78c7e2 100644
--- a/src/components/RepositoryNotifications.tsx
+++ b/src/components/RepositoryNotifications.tsx
@@ -62,19 +62,19 @@ export const RepositoryNotifications: FC<IRepositoryNotifications> = ({
   return (
     <>
       <div
-        className="group flex items-center justify-between bg-gray-100 px-3 py-2 dark:bg-gray-darker dark:text-white"
+        className="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
         onClick={toggleRepositoryNotifications}
       >
         <div
           className={cn(
-            'flex flex-1 space-x-3 overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium',
+            'flex flex-1 gap-4 items-center overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium',
             Opacity.MEDIUM,
           )}
         >
           <AvatarIcon
             title={repoName}
             url={avatarUrl}
-            size={Size.LARGE}
+            size={Size.XSMALL}
             defaultIcon={MarkGithubIcon}
           />
           <span
diff --git a/src/components/__snapshots__/AccountNotifications.test.tsx.snap b/src/components/__snapshots__/AccountNotifications.test.tsx.snap
index 2ccb84d28..bcf07bdf6 100644
--- a/src/components/__snapshots__/AccountNotifications.test.tsx.snap
+++ b/src/components/__snapshots__/AccountNotifications.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
   "baseElement": <body>
     <div>
       <div
-        class="group flex items-center justify-between px-3 py-2 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
+        class="group flex items-center justify-between px-3 py-1.5 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
       >
         <div
           class="flex gap-3"
@@ -31,7 +31,6 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
             </svg>
           </span>
           <button
-            class="opacity-80"
             title="Open Profile"
             type="button"
           >
@@ -96,7 +95,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
           class="flex-1 overflow-hidden overflow-ellipsis whitespace-nowrap cursor-pointer"
         >
           <div
-            class="mb-1 flex items-center gap-1 text-xs opacity-80"
+            class="mb-1 flex items-center gap-1 text-xs font-medium opacity-80"
             title="gitify-app/notifications-test"
           >
             <span>
@@ -293,7 +292,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
           class="flex-1 overflow-hidden overflow-ellipsis whitespace-nowrap cursor-pointer"
         >
           <div
-            class="mb-1 flex items-center gap-1 text-xs opacity-80"
+            class="mb-1 flex items-center gap-1 text-xs font-medium opacity-80"
             title="gitify-app/notifications-test"
           >
             <span>
@@ -423,7 +422,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
   </body>,
   "container": <div>
     <div
-      class="group flex items-center justify-between px-3 py-2 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
+      class="group flex items-center justify-between px-3 py-1.5 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
     >
       <div
         class="flex gap-3"
@@ -448,7 +447,6 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
           </svg>
         </span>
         <button
-          class="opacity-80"
           title="Open Profile"
           type="button"
         >
@@ -513,7 +511,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
         class="flex-1 overflow-hidden overflow-ellipsis whitespace-nowrap cursor-pointer"
       >
         <div
-          class="mb-1 flex items-center gap-1 text-xs opacity-80"
+          class="mb-1 flex items-center gap-1 text-xs font-medium opacity-80"
           title="gitify-app/notifications-test"
         >
           <span>
@@ -710,7 +708,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
         class="flex-1 overflow-hidden overflow-ellipsis whitespace-nowrap cursor-pointer"
       >
         <div
-          class="mb-1 flex items-center gap-1 text-xs opacity-80"
+          class="mb-1 flex items-center gap-1 text-xs font-medium opacity-80"
           title="gitify-app/notifications-test"
         >
           <span>
@@ -897,7 +895,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
   "baseElement": <body>
     <div>
       <div
-        class="group flex items-center justify-between px-3 py-2 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
+        class="group flex items-center justify-between px-3 py-1.5 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
       >
         <div
           class="flex gap-3"
@@ -922,7 +920,6 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
             </svg>
           </span>
           <button
-            class="opacity-80"
             title="Open Profile"
             type="button"
           >
@@ -963,7 +960,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
   </body>,
   "container": <div>
     <div
-      class="group flex items-center justify-between px-3 py-2 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
+      class="group flex items-center justify-between px-3 py-1.5 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
     >
       <div
         class="flex gap-3"
@@ -988,7 +985,6 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
           </svg>
         </span>
         <button
-          class="opacity-80"
           title="Open Profile"
           type="button"
         >
@@ -1086,7 +1082,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
   "baseElement": <body>
     <div>
       <div
-        class="group flex items-center justify-between px-3 py-2 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
+        class="group flex items-center justify-between px-3 py-1.5 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
       >
         <div
           class="flex gap-3"
@@ -1111,7 +1107,6 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
             </svg>
           </span>
           <button
-            class="opacity-80"
             title="Open Profile"
             type="button"
           >
@@ -1149,7 +1144,7 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
   </body>,
   "container": <div>
     <div
-      class="group flex items-center justify-between px-3 py-2 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
+      class="group flex items-center justify-between px-3 py-1.5 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
     >
       <div
         class="flex gap-3"
@@ -1174,7 +1169,6 @@ exports[`components/AccountNotifications.tsx should render itself (github.com wi
           </svg>
         </span>
         <button
-          class="opacity-80"
           title="Open Profile"
           type="button"
         >
@@ -1269,7 +1263,7 @@ exports[`components/AccountNotifications.tsx should toggle account notifications
   "baseElement": <body>
     <div>
       <div
-        class="group flex items-center justify-between px-3 py-2 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
+        class="group flex items-center justify-between px-3 py-1.5 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
       >
         <div
           class="flex gap-3"
@@ -1294,7 +1288,6 @@ exports[`components/AccountNotifications.tsx should toggle account notifications
             </svg>
           </span>
           <button
-            class="opacity-80"
             title="Open Profile"
             type="button"
           >
@@ -1331,7 +1324,7 @@ exports[`components/AccountNotifications.tsx should toggle account notifications
     </div>
     <div>
       <div
-        class="group flex items-center justify-between px-3 py-2 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
+        class="group flex items-center justify-between px-3 py-1.5 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
       >
         <div
           class="flex gap-3"
@@ -1356,7 +1349,6 @@ exports[`components/AccountNotifications.tsx should toggle account notifications
             </svg>
           </span>
           <button
-            class="opacity-80"
             title="Open Profile"
             type="button"
           >
@@ -1397,7 +1389,7 @@ exports[`components/AccountNotifications.tsx should toggle account notifications
   </body>,
   "container": <div>
     <div
-      class="group flex items-center justify-between px-3 py-2 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
+      class="group flex items-center justify-between px-3 py-1.5 text-sm font-semibold bg-gray-300 dark:bg-gray-darkest dark:text-white opacity-70"
     >
       <div
         class="flex gap-3"
@@ -1422,7 +1414,6 @@ exports[`components/AccountNotifications.tsx should toggle account notifications
           </svg>
         </span>
         <button
-          class="opacity-80"
           title="Open Profile"
           type="button"
         >
diff --git a/src/components/__snapshots__/NotificationRow.test.tsx.snap b/src/components/__snapshots__/NotificationRow.test.tsx.snap
index 674819102..bdef7919f 100644
--- a/src/components/__snapshots__/NotificationRow.test.tsx.snap
+++ b/src/components/__snapshots__/NotificationRow.test.tsx.snap
@@ -4667,7 +4667,7 @@ exports[`components/NotificationRow.tsx should render itself & its children - gr
           class="flex-1 overflow-hidden overflow-ellipsis whitespace-nowrap cursor-pointer"
         >
           <div
-            class="mb-1 flex items-center gap-1 text-xs opacity-80"
+            class="mb-1 flex items-center gap-1 text-xs font-medium opacity-80"
             title="gitify-app/notifications-test"
           >
             <span>
@@ -4867,7 +4867,7 @@ exports[`components/NotificationRow.tsx should render itself & its children - gr
         class="flex-1 overflow-hidden overflow-ellipsis whitespace-nowrap cursor-pointer"
       >
         <div
-          class="mb-1 flex items-center gap-1 text-xs opacity-80"
+          class="mb-1 flex items-center gap-1 text-xs font-medium opacity-80"
           title="gitify-app/notifications-test"
         >
           <span>
diff --git a/src/components/__snapshots__/RepositoryNotifications.test.tsx.snap b/src/components/__snapshots__/RepositoryNotifications.test.tsx.snap
index 9510298d5..28840d6aa 100644
--- a/src/components/__snapshots__/RepositoryNotifications.test.tsx.snap
+++ b/src/components/__snapshots__/RepositoryNotifications.test.tsx.snap
@@ -6,14 +6,14 @@ exports[`components/Repository.tsx should render itself & its children 1`] = `
   "baseElement": <body>
     <div>
       <div
-        class="group flex items-center justify-between bg-gray-100 px-3 py-2 dark:bg-gray-darker dark:text-white"
+        class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
       >
         <div
-          class="flex flex-1 space-x-3 overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
+          class="flex flex-1 gap-4 items-center overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
         >
           <img
             alt="gitify-app/notifications-test's avatar"
-            class="rounded-full object-cover size-6"
+            class="rounded-full object-cover size-4"
             src="https://avatars.githubusercontent.com/u/133795385?s=200&v=4"
           />
           <span
@@ -100,14 +100,14 @@ exports[`components/Repository.tsx should render itself & its children 1`] = `
   </body>,
   "container": <div>
     <div
-      class="group flex items-center justify-between bg-gray-100 px-3 py-2 dark:bg-gray-darker dark:text-white"
+      class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
     >
       <div
-        class="flex flex-1 space-x-3 overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
+        class="flex flex-1 gap-4 items-center overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
       >
         <img
           alt="gitify-app/notifications-test's avatar"
-          class="rounded-full object-cover size-6"
+          class="rounded-full object-cover size-4"
           src="https://avatars.githubusercontent.com/u/133795385?s=200&v=4"
         />
         <span
@@ -251,20 +251,20 @@ exports[`components/Repository.tsx should toggle account notifications visibilit
   "baseElement": <body>
     <div>
       <div
-        class="group flex items-center justify-between bg-gray-100 px-3 py-2 dark:bg-gray-darker dark:text-white"
+        class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
       >
         <div
-          class="flex flex-1 space-x-3 overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
+          class="flex flex-1 gap-4 items-center overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
         >
           <svg
             aria-hidden="true"
             class="text-gray-500 dark:text-gray-300"
             fill="currentColor"
             focusable="false"
-            height="18"
+            height="12"
             style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
             viewBox="0 0 16 16"
-            width="18"
+            width="12"
           >
             <path
               d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
@@ -347,20 +347,20 @@ exports[`components/Repository.tsx should toggle account notifications visibilit
     </div>
     <div>
       <div
-        class="group flex items-center justify-between bg-gray-100 px-3 py-2 dark:bg-gray-darker dark:text-white"
+        class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
       >
         <div
-          class="flex flex-1 space-x-3 overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
+          class="flex flex-1 gap-4 items-center overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
         >
           <svg
             aria-hidden="true"
             class="text-gray-500 dark:text-gray-300"
             fill="currentColor"
             focusable="false"
-            height="18"
+            height="12"
             style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
             viewBox="0 0 16 16"
-            width="18"
+            width="12"
           >
             <path
               d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
@@ -450,20 +450,20 @@ exports[`components/Repository.tsx should toggle account notifications visibilit
   </body>,
   "container": <div>
     <div
-      class="group flex items-center justify-between bg-gray-100 px-3 py-2 dark:bg-gray-darker dark:text-white"
+      class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
     >
       <div
-        class="flex flex-1 space-x-3 overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
+        class="flex flex-1 gap-4 items-center overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
       >
         <svg
           aria-hidden="true"
           class="text-gray-500 dark:text-gray-300"
           fill="currentColor"
           focusable="false"
-          height="18"
+          height="12"
           style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
-          width="18"
+          width="12"
         >
           <path
             d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
@@ -610,20 +610,20 @@ exports[`components/Repository.tsx should use default repository icon when avata
   "baseElement": <body>
     <div>
       <div
-        class="group flex items-center justify-between bg-gray-100 px-3 py-2 dark:bg-gray-darker dark:text-white"
+        class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
       >
         <div
-          class="flex flex-1 space-x-3 overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
+          class="flex flex-1 gap-4 items-center overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
         >
           <svg
             aria-hidden="true"
             class="text-gray-500 dark:text-gray-300"
             fill="currentColor"
             focusable="false"
-            height="18"
+            height="12"
             style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
             viewBox="0 0 16 16"
-            width="18"
+            width="12"
           >
             <path
               d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
@@ -713,20 +713,20 @@ exports[`components/Repository.tsx should use default repository icon when avata
   </body>,
   "container": <div>
     <div
-      class="group flex items-center justify-between bg-gray-100 px-3 py-2 dark:bg-gray-darker dark:text-white"
+      class="group flex justify-between bg-gray-100 px-3 py-1.5 dark:bg-gray-darker dark:text-white"
     >
       <div
-        class="flex flex-1 space-x-3 overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
+        class="flex flex-1 gap-4 items-center overflow-hidden overflow-ellipsis whitespace-nowrap text-sm font-medium opacity-80"
       >
         <svg
           aria-hidden="true"
           class="text-gray-500 dark:text-gray-300"
           fill="currentColor"
           focusable="false"
-          height="18"
+          height="12"
           style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
-          width="18"
+          width="12"
         >
           <path
             d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
