fix: Remove inline editing toggle on touch devices not to clobber view with unused elements (#618)

fsbraun · web-flow · commit 606fc862b9d5 · 2022-06-19T08:33:17.000+02:00
diff --git a/CHANGELOG.rst b/CHANGELOG.rst
@@ -5,6 +5,8 @@ Changelog
 Unreleased
 ==========
 
+* Removed inline editing toggle button from touch devices (where it is inactive anyways) and collapsed menus
+
 
 5.1.0 (2022-03-24)
 ==================
diff --git a/djangocms_text_ckeditor/static/djangocms_text_ckeditor/css/cms.inline-ckeditor.css b/djangocms_text_ckeditor/static/djangocms_text_ckeditor/css/cms.inline-ckeditor.css
@@ -5,3 +5,7 @@
 .cke_reset_all div.cke_dialog_page_contents > table {
     height: 100%;
 }
+
+div.cms .cms-more-buttons a.cms-btn.cms-edit-toggle {
+    display: none;
+}
diff --git a/djangocms_text_ckeditor/static/djangocms_text_ckeditor/js/cms.ckeditor.js b/djangocms_text_ckeditor/static/djangocms_text_ckeditor/js/cms.ckeditor.js
@@ -463,6 +463,9 @@
             CMS.CKEditor.touchdevice = 'ontouchstart' in window || navigator.msMaxTouchPoints;  // on touch device?
             if (!CMS.CKEditor.touchdevice) {  // no inline editing on touch devices to not interfere with scrolling
                 CMS.CKEditor.initInlineEditors();
+                $('div.cms a.cms-btn.cms-edit-toggle').show();
+            } else {
+                $('div.cms a.cms-btn.cms-edit-toggle').hide();
             }
             CMS.CKEditor.initAdminEditors();
         },
diff --git a/djangocms_text_ckeditor/static/djangocms_text_ckeditor/js/dist/bundle-3d3a4963e8.cms.ckeditor.min.js b/djangocms_text_ckeditor/static/djangocms_text_ckeditor/js/dist/bundle-3d3a4963e8.cms.ckeditor.min.js
diff --git a/djangocms_text_ckeditor/templates/cms/toolbar/icon-button.html b/djangocms_text_ckeditor/templates/cms/toolbar/icon-button.html
@@ -1 +1 @@
-<a href="{{ url }}" title="{{ name }}" style="font-family: django-cms-iconfont;" class="cms-btn{% if active %} cms-btn-active{% endif %}{% if disabled %} cms-btn-disabled{% endif %}"><span{% if extra_classes %} class="{{ extra_classes|join:' ' }}"{% endif %}></span></a>
+<a href="{{ url }}" title="{{ name }}" style="font-family: django-cms-iconfont;" class="cms-btn cms-edit-toggle{% if active %} cms-btn-active{% endif %}{% if disabled %} cms-btn-disabled{% endif %}"><span{% if extra_classes %} class="{{ extra_classes|join:' ' }}"{% endif %}></span></a>
diff --git a/djangocms_text_ckeditor/widgets.py b/djangocms_text_ckeditor/widgets.py
@@ -16,7 +16,7 @@
 
 
 # this path is changed automatically whenever you run `gulp bundle`
-PATH_TO_JS = 'djangocms_text_ckeditor/js/dist/bundle-1c5205cc04.cms.ckeditor.min.js'
+PATH_TO_JS = 'djangocms_text_ckeditor/js/dist/bundle-3d3a4963e8.cms.ckeditor.min.js'
 
 
 class TextEditorWidget(forms.Textarea):

Original file line number	Diff line number	Diff line change
`@@ -5,3 +5,7 @@`
`5`	`5`	`.cke_reset_all div.cke_dialog_page_contents > table {`
`6`	`6`	`height: 100%;`
`7`	`7`	`}`
	`8`	`+`
	`9`	`+div.cms .cms-more-buttons a.cms-btn.cms-edit-toggle {`
	`10`	`+ display: none;`
	`11`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -1 +1 @@`
`1`		`-<a href="{{ url }}" title="{{ name }}" style="font-family: django-cms-iconfont;" class="cms-btn{% if active %} cms-btn-active{% endif %}{% if disabled %} cms-btn-disabled{% endif %}"><span{% if extra_classes %} class="{{ extra_classes\|join:' ' }}"{% endif %}></span></a>`
	`1`	`+<a href="{{ url }}" title="{{ name }}" style="font-family: django-cms-iconfont;" class="cms-btn cms-edit-toggle{% if active %} cms-btn-active{% endif %}{% if disabled %} cms-btn-disabled{% endif %}"><span{% if extra_classes %} class="{{ extra_classes\|join:' ' }}"{% endif %}></span></a>`