Implemented icon separattion using sx prop

srdas · Nov 4, 2024 · 83e7824 · 83e7824
1 parent 0f128e6
commit 83e7824
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/packages/jupyter-ai/src/components/code-blocks/code-toolbar.tsx b/packages/jupyter-ai/src/components/code-blocks/code-toolbar.tsx
@@ -116,7 +116,7 @@ function InsertAboveButton(props: ToolbarButtonProps) {
       }}
       disabled={!props.activeCellExists}
     >
-      <addAboveIcon.react height="16px" width="16px" paddingRight="8px" />
+      <addAboveIcon.react height="16px" width="16px" />
     </TooltippedIconButton>
   );
 }
@@ -142,7 +142,7 @@ function InsertBelowButton(props: ToolbarButtonProps) {
         }
       }}
     >
-      <addBelowIcon.react height="16px" width="16px" paddingRight="8px" />
+      <addBelowIcon.react height="16px" width="16px" />
     </TooltippedIconButton>
   );
 }
@@ -166,7 +166,7 @@ function ReplaceButton(props: ToolbarButtonProps) {
         }
       }}
     >
-      <replaceCellIcon.react height="16px" width="16px" paddingRight="8px" />
+      <replaceCellIcon.react height="16px" width="16px" />
     </TooltippedIconButton>
   );
 }

diff --git a/packages/jupyter-ai/src/components/mui-extras/tooltipped-icon-button.tsx b/packages/jupyter-ai/src/components/mui-extras/tooltipped-icon-button.tsx
@@ -80,6 +80,7 @@ export function TooltippedIconButton(
           onClick={props.onClick}
           disabled={props.disabled}
           sx={{
+            mr: '8px',
             lineHeight: 0,
             ...(props.disabled && { opacity: 0.5 }),
             ...props.sx