diff --git a/app/editor/menus/formatting.tsx b/app/editor/menus/formatting.tsx index dcdcb1a25..39a138732 100644 --- a/app/editor/menus/formatting.tsx +++ b/app/editor/menus/formatting.tsx @@ -19,7 +19,6 @@ import { Heading3Icon, } from "outline-icons"; import { EditorState } from "prosemirror-state"; -import { isInTable } from "prosemirror-tables"; import * as React from "react"; import isInCode from "@shared/editor/queries/isInCode"; import isInList from "@shared/editor/queries/isInList"; @@ -35,11 +34,9 @@ export default function formattingMenuItems( dictionary: Dictionary ): MenuItem[] { const { schema } = state; - const isTable = isInTable(state); const isList = isInList(state); const isCode = isInCode(state); const isCodeBlock = isInCode(state, { onlyBlock: true }); - const allowBlocks = !isTable && !isList; return [ { @@ -90,7 +87,7 @@ export default function formattingMenuItems( }, { name: "separator", - visible: allowBlocks && !isCode, + visible: !isCode, }, { name: "heading", @@ -98,7 +95,7 @@ export default function formattingMenuItems( icon: , active: isNodeActive(schema.nodes.heading, { level: 1 }), attrs: { level: 1 }, - visible: allowBlocks && !isCode, + visible: !isCode, }, { name: "heading", @@ -106,7 +103,7 @@ export default function formattingMenuItems( icon: , active: isNodeActive(schema.nodes.heading, { level: 2 }), attrs: { level: 2 }, - visible: allowBlocks && !isCode, + visible: !isCode, }, { name: "heading", @@ -114,7 +111,7 @@ export default function formattingMenuItems( icon: , active: isNodeActive(schema.nodes.heading, { level: 3 }), attrs: { level: 3 }, - visible: allowBlocks && !isCode, + visible: !isCode, }, { name: "blockquote", @@ -122,11 +119,11 @@ export default function formattingMenuItems( icon: , active: isNodeActive(schema.nodes.blockquote), attrs: { level: 2 }, - visible: allowBlocks && !isCode, + visible: !isCode, }, { name: "separator", - visible: (allowBlocks || isList) && !isCode, + visible: !isCode, }, { name: "checkbox_list", @@ -134,21 +131,21 @@ export default function formattingMenuItems( icon: , keywords: "checklist checkbox task", active: isNodeActive(schema.nodes.checkbox_list), - visible: (allowBlocks || isList) && !isCode, + visible: !isCode, }, { name: "bullet_list", tooltip: dictionary.bulletList, icon: , active: isNodeActive(schema.nodes.bullet_list), - visible: (allowBlocks || isList) && !isCode, + visible: !isCode, }, { name: "ordered_list", tooltip: dictionary.orderedList, icon: , active: isNodeActive(schema.nodes.ordered_list), - visible: (allowBlocks || isList) && !isCode, + visible: !isCode, }, { name: "outdentList", diff --git a/shared/editor/components/Styles.ts b/shared/editor/components/Styles.ts index 8a18a193a..8632bf63f 100644 --- a/shared/editor/components/Styles.ts +++ b/shared/editor/components/Styles.ts @@ -357,7 +357,7 @@ width: 100%; } &:not(.placeholder):before { - display: ${props.readOnly ? "none" : "inline-block"}; + display: none; font-family: ${props.theme.fontFamilyMono}; color: ${props.theme.textSecondary}; font-size: 13px; @@ -774,7 +774,7 @@ h6:not(.placeholder):before { background: ${props.theme.background}; margin-${props.rtl ? "right" : "left"}: -26px; flex-direction: ${props.rtl ? "row-reverse" : "row"}; - display: inline-flex; + display: none; position: relative; top: -2px; width: 26px; @@ -809,6 +809,22 @@ h6 { } } +.ProseMirror > { + h1, + h2, + h3, + h4, + h5, + h6 { + .heading-actions { + display: inline-flex; + } + &:not(.placeholder):before { + display: ${props.readOnly ? "none" : "inline-block"}; + } + } +} + .heading-fold { display: inline-block; transform-origin: center; @@ -864,9 +880,6 @@ h6 { a { color: ${props.theme.noticeInfoText}; - } - - a:not(.heading-name) { text-decoration: underline; }