diff --git a/packages/core/src/editor/Block.css b/packages/core/src/editor/Block.css index 1c21c06dc9..c131eeeb80 100644 --- a/packages/core/src/editor/Block.css +++ b/packages/core/src/editor/Block.css @@ -40,10 +40,6 @@ BASIC STYLES overflow: visible; } -.bn-inline-content { - width: 100%; -} - /* NESTED BLOCKS */ @@ -542,15 +538,13 @@ NESTED BLOCKS } /* PLACEHOLDERS*/ -.bn-inline-content:has(> .ProseMirror-trailingBreak:only-child):before { - /*float: left; */ - pointer-events: none; - height: 0; - /* width: 0; */ - position: absolute; +.bn-block-content:has(.ProseMirror-trailingBreak:only-child):after { font-style: italic; + /* Removes text cursor offset. */ + margin-inline: -2px; + pointer-events: none; + max-width: 100%; } -/* TODO: should this be here? */ /* TEXT COLORS */ [data-style-type="textColor"][data-value="gray"], diff --git a/packages/core/src/extensions/Placeholder/Placeholder.ts b/packages/core/src/extensions/Placeholder/Placeholder.ts index 795a139279..4a3185e353 100644 --- a/packages/core/src/extensions/Placeholder/Placeholder.ts +++ b/packages/core/src/extensions/Placeholder/Placeholder.ts @@ -41,7 +41,7 @@ export const PlaceholderExtension = createExtension( const styleSheet = styleEl.sheet!; const getSelector = (additionalSelectors = "") => - `.${uniqueEditorSelector} .bn-block-content${additionalSelectors} .bn-inline-content:has(> .ProseMirror-trailingBreak:only-child):before`; + `.${uniqueEditorSelector} .bn-block-content${additionalSelectors}:has(.ProseMirror-trailingBreak:only-child):after`; try { // FIXME: the names "default" and "emptyDocument" are hardcoded diff --git a/packages/react/src/editor/styles.css b/packages/react/src/editor/styles.css index 3862946986..c72f9f32ad 100644 --- a/packages/react/src/editor/styles.css +++ b/packages/react/src/editor/styles.css @@ -120,7 +120,7 @@ } /* Placeholder styling */ -.bn-inline-content:has(> .ProseMirror-trailingBreak):before { +.bn-block-content:has(.ProseMirror-trailingBreak):after { color: var(--bn-colors-side-menu); }