refactor: styling and enters

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

Hide file tree

Showing 3 changed files with 13 additions and 7 deletions.
diff --git a/packages/sn-editor-react/src/components/editor.tsx b/packages/sn-editor-react/src/components/editor.tsx
@@ -27,10 +27,9 @@ const useStyles = makeStyles((theme) => {
         paddingBlock: '10px',
         display: 'flex',
         flexDirection: 'column',
-        alignItems: 'flex-start',
+        alignItems: 'strech',
         rowGap: '20px',
         '& .panel': {
-          display: 'inline-block',
           border: '2px solid',
           borderColor: theme.palette.primary.main,
           borderRadius: '8px',

diff --git a/packages/sn-editor-react/src/components/menu-bar.tsx b/packages/sn-editor-react/src/components/menu-bar.tsx
@@ -180,6 +180,10 @@ export const MenuBar: FC<MenuBarProps> = ({ editor }) => {
           <FormatListNumberedIcon />
         </IconButton>
       </Tooltip>
+      <AccordionControl
+        editor={editor}
+        buttonProps={{ classes: { root: classes.button, colorPrimary: classes.buttonPrimary } }}
+      />
       <LinkControl
         editor={editor}
         buttonProps={{ classes: { root: classes.button, colorPrimary: classes.buttonPrimary } }}
@@ -218,10 +222,7 @@ export const MenuBar: FC<MenuBarProps> = ({ editor }) => {
           <RedoIcon />
         </IconButton>
       </Tooltip>
-      <AccordionControl
-        editor={editor}
-        buttonProps={{ classes: { root: classes.button, colorPrimary: classes.buttonPrimary } }}
-      />
+
       <HTMLEditorControl
         editor={editor}
         buttonProps={{ classes: { root: classes.button, colorPrimary: classes.buttonPrimary } }}

diff --git a/packages/sn-editor-react/src/extension-list.ts b/packages/sn-editor-react/src/extension-list.ts
@@ -49,7 +49,13 @@ export const createExtensions = (options?: ExtensionOptions) => [
   Document.configure(),
   Dropcursor.configure(),
   Gapcursor.configure(),
-  HardBreak.configure(),
+  HardBreak.configure().extend({
+    addKeyboardShortcuts() {
+      return {
+        Enter: () => this.editor.commands.setHardBreak(),
+      }
+    },
+  }),
   Heading.configure(),
   History.configure(),
   Italic.configure(),