From 67c847b704c244d9e4699cb066b5c4ac47e2e1f4 Mon Sep 17 00:00:00 2001 From: Matthias Kestenholz Date: Fri, 20 Dec 2024 16:10:50 +0100 Subject: [PATCH] Fix the content editor integration --- CHANGELOG.rst | 2 ++ django_prose_editor/static/django_prose_editor/editor.css | 2 +- src/editor.css | 2 +- 3 files changed, 4 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.rst b/CHANGELOG.rst index 321f9a1..1391148 100644 --- a/CHANGELOG.rst +++ b/CHANGELOG.rst @@ -8,6 +8,8 @@ Next version package has been yanked. - Applied the ``--prose-editor-background`` and ``--prose-editor-foreground`` CSS variables to the ProseMirror editing area. +- Fixed the django-content-editor support tweak where an empty label would make + the editor move to the left border. 0.10 (2024-12-17) diff --git a/django_prose_editor/static/django_prose_editor/editor.css b/django_prose_editor/static/django_prose_editor/editor.css index e64c7ab..cf62714 100644 --- a/django_prose_editor/static/django_prose_editor/editor.css +++ b/django_prose_editor/static/django_prose_editor/editor.css @@ -1 +1 @@ -.prose-editor *,.prose-editor *:before,.prose-editor *:after{box-sizing:inherit}.prose-editor{box-sizing:border-box;position:relative;max-width:120ch;min-width:40ch;flex-grow:1}.prose-editor,.prose-editor-dialog{--_b: var(--prose-editor-background, var(--body-bg, #fff));--_f: var(--prose-editor-foreground, var(--body-fg, #333));--_r: var(--prose-editor-border-color, var(--border-color, #ccc));--_a: var(--prose-editor-active-color, var(--primary, #79aec8));--_d: var(--prose-editor-disabled-color, var(--border-color, #ccc));--_t: var(--prose-editor-typographic, #ccc)}[data-django-prose-editor]{opacity:0}.prose-editor-wrapper+textarea{display:none!important}.prose-menubar{font-size:14px;display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:2px}.prose-menubar__group{display:flex}.prose-menubar__button{cursor:pointer;padding:0 .25em;min-width:2em;transition:all .25s;background:var(--_b);color:var(--_f);border:1px solid var(--_r);text-align:center;display:inline-flex;align-items:center;position:relative}.prose-menubar__button.hidden{display:none!important}.prose-menubar__button--heading .level{position:absolute;right:3px;bottom:2px;font-size:80%}.prose-menubar__button:not(.hidden){border-top-left-radius:4px;border-bottom-left-radius:4px}.prose-menubar__button:not(.hidden)~.prose-menubar__button:not(.hidden){border-top-left-radius:0;border-bottom-left-radius:0}.prose-menubar__button:not(.hidden):not(:has(~.prose-menubar__button:not(.hidden))){border-top-right-radius:4px;border-bottom-right-radius:4px}.prose-menubar__button+.prose-menubar__button{border-left:none}.prose-menubar__button.material-icons{padding:0 .125em;min-width:auto}.prose-menubar__button:hover{filter:brightness(110%)}.prose-menubar__button.active{background-color:var(--_a)}.prose-menubar__button.disabled:not(.active){background:var(--_d);filter:brightness(100%);cursor:not-allowed;opacity:.3}.prose-editor .ProseMirror{padding:0 6px;background:var(--_b);color:var(--_f);border:1px solid var(--_r);border-radius:4px}.prose-editor-dialog{background:var(--_b);color:var(--_f);border:1px solid var(--_r);border-radius:4px}.prose-editor-dialog label{display:block}.prose-editor-dialog button{all:unset;cursor:pointer;padding:.25em .5em;min-width:2em;transition:all .25s;background:var(--_b);color:var(--_f);border:1px solid var(--_r);border-radius:4px;text-align:center;display:inline-flex;position:relative}.prose-editor-dialog button:active,.prose-editor-dialog button:hover{background:var(--_a)}label:empty:has(+.prose-editor){display:none}.prose-editor-nbsp{background:var(--_t);box-shadow:0 2px 0 0 var(--_t),0 -2px 0 0 var(--_t)}.prose-editor-shy{background:var(--_t);box-shadow:0 2px 0 1px var(--_t),0 -2px 0 1px var(--_t)} +.prose-editor *,.prose-editor *:before,.prose-editor *:after{box-sizing:inherit}.prose-editor{box-sizing:border-box;position:relative;max-width:120ch;min-width:40ch;flex-grow:1}.prose-editor,.prose-editor-dialog{--_b: var(--prose-editor-background, var(--body-bg, #fff));--_f: var(--prose-editor-foreground, var(--body-fg, #333));--_r: var(--prose-editor-border-color, var(--border-color, #ccc));--_a: var(--prose-editor-active-color, var(--primary, #79aec8));--_d: var(--prose-editor-disabled-color, var(--border-color, #ccc));--_t: var(--prose-editor-typographic, #ccc)}[data-django-prose-editor]{opacity:0}.prose-editor-wrapper+textarea{display:none!important}.prose-menubar{font-size:14px;display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:2px}.prose-menubar__group{display:flex}.prose-menubar__button{cursor:pointer;padding:0 .25em;min-width:2em;transition:all .25s;background:var(--_b);color:var(--_f);border:1px solid var(--_r);text-align:center;display:inline-flex;align-items:center;position:relative}.prose-menubar__button.hidden{display:none!important}.prose-menubar__button--heading .level{position:absolute;right:3px;bottom:2px;font-size:80%}.prose-menubar__button:not(.hidden){border-top-left-radius:4px;border-bottom-left-radius:4px}.prose-menubar__button:not(.hidden)~.prose-menubar__button:not(.hidden){border-top-left-radius:0;border-bottom-left-radius:0}.prose-menubar__button:not(.hidden):not(:has(~.prose-menubar__button:not(.hidden))){border-top-right-radius:4px;border-bottom-right-radius:4px}.prose-menubar__button+.prose-menubar__button{border-left:none}.prose-menubar__button.material-icons{padding:0 .125em;min-width:auto}.prose-menubar__button:hover{filter:brightness(110%)}.prose-menubar__button.active{background-color:var(--_a)}.prose-menubar__button.disabled:not(.active){background:var(--_d);filter:brightness(100%);cursor:not-allowed;opacity:.3}.prose-editor .ProseMirror{padding:0 6px;background:var(--_b);color:var(--_f);border:1px solid var(--_r);border-radius:4px}.prose-editor-dialog{background:var(--_b);color:var(--_f);border:1px solid var(--_r);border-radius:4px}.prose-editor-dialog label{display:block}.prose-editor-dialog button{all:unset;cursor:pointer;padding:.25em .5em;min-width:2em;transition:all .25s;background:var(--_b);color:var(--_f);border:1px solid var(--_r);border-radius:4px;text-align:center;display:inline-flex;position:relative}.prose-editor-dialog button:active,.prose-editor-dialog button:hover{background:var(--_a)}label:empty:has(+.prose-editor-wrapper){display:none}.prose-editor-nbsp{background:var(--_t);box-shadow:0 2px 0 0 var(--_t),0 -2px 0 0 var(--_t)}.prose-editor-shy{background:var(--_t);box-shadow:0 2px 0 1px var(--_t),0 -2px 0 1px var(--_t)} diff --git a/src/editor.css b/src/editor.css index a36fc77..88df637 100644 --- a/src/editor.css +++ b/src/editor.css @@ -155,7 +155,7 @@ } /* content editor support */ -label:empty:has(+ .prose-editor) { +label:empty:has(+ .prose-editor-wrapper) { display: none; }