fix #188 prevent flickering of submenus in RTA

jrief · Jan 20, 2025 · 2db20e8 · 2db20e8
1 parent 5e68519
commit 2db20e8
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 1 deletion.
diff --git a/client/django-formset/RichtextArea.ts b/client/django-formset/RichtextArea.ts
@@ -1057,6 +1057,8 @@ class RichtextArea {
 				this.installEventHandlers();
 				this.attributesObserver.observe(this.textAreaElement, {attributes: true});
 				if (this.menubarElement) {
+					// to prevent flickering when loading the page, the visibility of the menubar is hidden
+					this.menubarElement.style.visibility = '';
 					this.resizeObserver.observe(this.menubarElement);
 					this.wrapMenubar();
 				}

diff --git a/formset/templates/formset/default/widgets/richtextarea.html b/formset/templates/formset/default/widgets/richtextarea.html
@@ -1,6 +1,6 @@
 {% spaceless %}
 <div class="{% block wrapper_classes %}dj-richtext-wrapper{% endblock %}">
-	<div role="menubar">{{ control_panel }}</div>
+	<div role="menubar" style="visibility: hidden;">{{ control_panel }}</div>
 	{% for dialog_form in dialog_forms %}{{ dialog_form }}{% endfor %}
 </div>
 <textarea is="django-richtext" name="{{ widget.name }}"{% include "django/forms/widgets/attrs.html" %}>{{ widget.value }}</textarea>