Repository: gitify-app/gitify
Pull request #1185 (2024-06-05 16:48:36)

refactor: tooltips


Patch:
diff --git a/src/components/fields/Tooltip.tsx b/src/components/fields/Tooltip.tsx
index fdf89223..fa4e5517 100644
--- a/src/components/fields/Tooltip.tsx
+++ b/src/components/fields/Tooltip.tsx
@@ -19,7 +19,7 @@ export const Tooltip: FC<ITooltip> = (props: ITooltip) => {
     >
       <QuestionIcon className="text-blue-500 ml-1" />
       {showTooltip && (
-        <div className="absolute bg-white dark:bg-gray-sidebar border border-gray-300 rounded p-2 shadow">
+        <div className="absolute bg-white dark:bg-gray-sidebar border border-gray-300 rounded p-2 shadow z-10">
           <div className="text-gray-700 dark:text-white text-xs text-left">
             {props.tooltip}
           </div>
diff --git a/src/routes/Settings.tsx b/src/routes/Settings.tsx
index 25bfdb35..125b2935 100644
--- a/src/routes/Settings.tsx
+++ b/src/routes/Settings.tsx
@@ -173,18 +173,16 @@ export const SettingsRoute: FC = () => {
             }
             tooltip={
               <div>
-                <div className="pb-3">
-                  See
-                  <button
-                    type="button"
-                    className="text-blue-500 mx-1"
-                    title="Open GitHub documentation for participating and watching notifications"
-                    onClick={openGitHubParticipatingDocs}
-                  >
-                    official docs
-                  </button>
-                  for more details.
-                </div>
+                See
+                <button
+                  type="button"
+                  className="text-blue-500 mx-1"
+                  title="Open GitHub documentation for participating and watching notifications"
+                  onClick={openGitHubParticipatingDocs}
+                >
+                  official docs
+                </button>
+                for more details.
               </div>
             }
           />
@@ -227,11 +225,9 @@ export const SettingsRoute: FC = () => {
             }
             tooltip={
               <div>
-                <div className="pb-3">
-                  Keep the notification within Gitify window upon interaction
-                  (click, mark as read, mark as done, etc) until the next
-                  refresh window (scheduled or user initiated)
-                </div>
+                Keep the notification within Gitify window upon interaction
+                (click, mark as read, mark as done, etc) until the next refresh
+                window (scheduled or user initiated)
               </div>
             }
           />


Test patch:
diff --git a/src/components/fields/__snapshots__/Tooltip.test.tsx.snap b/src/components/fields/__snapshots__/Tooltip.test.tsx.snap
index 2fe780fc..d8c4bad3 100644
--- a/src/components/fields/__snapshots__/Tooltip.test.tsx.snap
+++ b/src/components/fields/__snapshots__/Tooltip.test.tsx.snap
@@ -21,7 +21,7 @@ exports[`components/fields/Tooltip.tsx should display on mouse enter / leave 1`]
     />
   </svg>
   <div
-    class="absolute bg-white dark:bg-gray-sidebar border border-gray-300 rounded p-2 shadow"
+    class="absolute bg-white dark:bg-gray-sidebar border border-gray-300 rounded p-2 shadow z-10"
   >
     <div
       class="text-gray-700 dark:text-white text-xs text-left"