From d8c7970000e302ab7d97db63f513cce287c54b7e Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Tue, 1 Aug 2023 17:44:21 +0800
Subject: [PATCH] Hover action sizes

---
 packages/web/components/elements/Button.tsx        |  2 +-
 .../patterns/LibraryCards/LibraryHoverActions.tsx  | 14 +++++++++-----
 2 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/packages/web/components/elements/Button.tsx b/packages/web/components/elements/Button.tsx
index e9085ad81..4d36a2b2d 100644
--- a/packages/web/components/elements/Button.tsx
+++ b/packages/web/components/elements/Button.tsx
@@ -262,7 +262,7 @@ export const Button = styled('button', {
         cursor: 'pointer',
         padding: '4px',
         height: '100%',
-        pt: '6px',
+        pt: '5px',
         minWidth: '25px',
 
         '&:hover': {
diff --git a/packages/web/components/patterns/LibraryCards/LibraryHoverActions.tsx b/packages/web/components/patterns/LibraryCards/LibraryHoverActions.tsx
index 7764b76e2..16cf0d602 100644
--- a/packages/web/components/patterns/LibraryCards/LibraryHoverActions.tsx
+++ b/packages/web/components/patterns/LibraryCards/LibraryHoverActions.tsx
@@ -60,6 +60,7 @@ export const LibraryHoverActions = (props: LibraryHoverActionsProps) => {
       }}
     >
       <Button
+        title="View Notebook (t)"
         style="hoverActionIcon"
         onClick={(event) => {
           props.handleAction('open-notebook')
@@ -70,11 +71,12 @@ export const LibraryHoverActions = (props: LibraryHoverActionsProps) => {
         }}
       >
         <NotebookIcon
-          size={19}
+          size={21}
           color={theme.colors.thNotebookSubtle.toString()}
         />
       </Button>
       <Button
+        title="Archive (e)"
         style="hoverActionIcon"
         onClick={(event) => {
           const action = props.item.isArchived ? 'unarchive' : 'archive'
@@ -84,33 +86,35 @@ export const LibraryHoverActions = (props: LibraryHoverActionsProps) => {
       >
         {props.item.isArchived ? (
           <UnarchiveIcon
-            size={18}
+            size={21}
             color={theme.colors.thNotebookSubtle.toString()}
           />
         ) : (
           <ArchiveIcon
-            size={18}
+            size={21}
             color={theme.colors.thNotebookSubtle.toString()}
           />
         )}
       </Button>
       <Button
+        title="Remove (#)"
         style="hoverActionIcon"
         onClick={(event) => {
           props.handleAction('delete')
           event.preventDefault()
         }}
       >
-        <TrashIcon size={18} color={theme.colors.thNotebookSubtle.toString()} />
+        <TrashIcon size={21} color={theme.colors.thNotebookSubtle.toString()} />
       </Button>
       <Button
+        title="Edit labels (l)"
         style="hoverActionIcon"
         onClick={(event) => {
           props.handleAction('set-labels')
           event.preventDefault()
         }}
       >
-        <LabelIcon size={18} color={theme.colors.thNotebookSubtle.toString()} />
+        <LabelIcon size={21} color={theme.colors.thNotebookSubtle.toString()} />
       </Button>
       <CardMenu
         item={props.item}