From 59e7bc4da0a7e2d5cf7bb488b583b9f658bd301e Mon Sep 17 00:00:00 2001
From: Dariusz Szut <dew326@gmail.com>
Date: Wed, 7 Feb 2024 15:21:36 +0100
Subject: [PATCH] IBX-7219: Fixed formatted focus (#145)

---
 .../public/js/CKEditor/formatted/formatted-editing.js       | 4 +---
 src/bundle/Resources/public/scss/_general.scss              | 6 ++++++
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/bundle/Resources/public/js/CKEditor/formatted/formatted-editing.js b/src/bundle/Resources/public/js/CKEditor/formatted/formatted-editing.js
index 536680cf..561601d0 100644
--- a/src/bundle/Resources/public/js/CKEditor/formatted/formatted-editing.js
+++ b/src/bundle/Resources/public/js/CKEditor/formatted/formatted-editing.js
@@ -1,5 +1,4 @@
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
-import { toWidgetEditable } from '@ckeditor/ckeditor5-widget/src/utils';
 import { rawSnippetTextToViewDocumentFragment } from '@ckeditor/ckeditor5-code-block/src/utils';
 import UpcastWriter from '@ckeditor/ckeditor5-engine/src/view/upcastwriter';
 import Widget from '@ckeditor/ckeditor5-widget/src/widget';
@@ -30,8 +29,7 @@ class IbexaFormattedEditing extends Plugin {
 
         conversion.for('editingDowncast').elementToElement({
             model: 'formatted',
-            view: (modelElement, { writer: downcastWriter }) =>
-                toWidgetEditable(downcastWriter.createEditableElement('pre'), downcastWriter),
+            view: (modelElement, { writer: downcastWriter }) => downcastWriter.createContainerElement('pre'),
         });
 
         conversion.for('dataDowncast').elementToElement({
diff --git a/src/bundle/Resources/public/scss/_general.scss b/src/bundle/Resources/public/scss/_general.scss
index 237fea23..f978dfee 100644
--- a/src/bundle/Resources/public/scss/_general.scss
+++ b/src/bundle/Resources/public/scss/_general.scss
@@ -203,6 +203,12 @@
         min-height: calculateRem(20px);
     }
 
+    pre {
+        border: calculateRem(1px) solid $ibexa-color-dark-200;
+        border-radius: $ibexa-border-radius;
+        padding: calculateRem(4px) calculateRem(8px);
+    }
+
     [id]:not(.ibexa-data-source__richtext) {
         position: relative;