refactor: icon

SenseNet · Jun 6, 2024 · e2e92df · e2e92df
1 parent 18a7513
commit e2e92df
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 18 deletions.
diff --git a/packages/sn-editor-react/src/components/controls/accordion-control.tsx b/packages/sn-editor-react/src/components/controls/accordion-control.tsx
@@ -24,12 +24,25 @@ const useStyles = makeStyles((theme: Theme) => {
   return createStyles({
     ListIcon: {
       paddingLeft: '0px',
-      '& .down-arrow': {
-        position: 'absolute',
-        right: '0',
-        marginRight: '-6px',
-        top: '0',
-        marginTop: '3px',
+      height: '32px',
+      '& .MuiIconButton-label': {
+        flexDirection: 'column',
+        height: 'inherit',
+        justifyContent: 'center',
+        '& .icon-container': {
+          '&:first-of-type': {
+            marginBottom: '-14px',
+          },
+          height: '23px',
+          position: 'relative',
+          '& .down-arrow': {
+            top: '0',
+            right: '0',
+            position: 'absolute',
+            marginTop: '0px',
+            marginRight: '-13px',
+          },
+        },
       },
     },
     accordion: {
@@ -158,8 +171,14 @@ export const AccordionControl: FC<AccordionControlProps> = ({ buttonProps, edito
     <>
       <Tooltip title={localization.accordionControl.title}>
         <IconButton className={classes.ListIcon} onClick={handleClickOpen} {...buttonProps}>
-          <ArrowDropDown className="down-arrow" />
-          <DragHandle />
+          <div className="icon-container">
+            <ArrowDropDown className="down-arrow" />
+            <DragHandle />
+          </div>
+          <div className="icon-container">
+            <ArrowDropDown className="down-arrow" />
+            <DragHandle />
+          </div>
         </IconButton>
       </Tooltip>
       <Dialog

diff --git a/packages/sn-editor-react/src/components/menu-bar.tsx b/packages/sn-editor-react/src/components/menu-bar.tsx
@@ -77,16 +77,6 @@ export const MenuBar: FC<MenuBarProps> = ({ editor }) => {
     <div className={classes.root}>
       <TypographyControl editor={editor} />
       <div className={classes.divider} />
-      {/* <Tooltip title={`${localization.menubar.bold}`}>
-        <IconButton
-          onClick={() =>
-            editor.chain().focus().setYoutubeVideo({ src: 'https://www.youtube.com/watch?v=dQw4w9WgXcQ' }).run()
-          }
-          color={editor.isActive('bold') ? 'primary' : 'default'}
-          classes={{ root: classes.button, colorPrimary: classes.buttonPrimary }}>
-          <strong>B</strong>
-        </IconButton>
-      </Tooltip> */}
       <Tooltip title={`${localization.menubar.bold} (Ctrl + B)`}>
         <IconButton
           onClick={() => editor.chain().focus().toggleBold().run()}