diff --git a/src/core/editor/components/rich-text-editor/rich-text-editor.scss b/src/core/editor/components/rich-text-editor/rich-text-editor.scss
index 5b929a3cf..ae01ced74 100644
--- a/src/core/editor/components/rich-text-editor/rich-text-editor.scss
+++ b/src/core/editor/components/rich-text-editor/rich-text-editor.scss
@@ -11,15 +11,20 @@ ion-app.app-root core-rich-text-editor {
}
.core-rte-editor-container {
- height: 100%;
- position: relative;
+ max-height: calc(100% - 46px);
+ display: flex;
+ flex-direction: column;
+ flex-grow: 1;
+ &.toolbar-hidden {
+ max-height: 100%;
+ }
.core-rte-info-message {
- position: absolute;
- bottom: 0;
- padding: 3px;
- border: 1px solid $info;
- border-radius: 5px;
+ padding: 5px;
+ border-top: 1px solid $info;
+ background: white;
+ flex-shrink: 1;
+ font-size: 1.4rem;
.icon {
color: $info;
@@ -33,6 +38,7 @@ ion-app.app-root core-rich-text-editor {
width: 100%;
resize: none;
background-color: $white;
+ flex-grow: 1;
@include darkmode() {
background-color: $gray-darker;
color: $white;
diff --git a/src/core/editor/components/rich-text-editor/rich-text-editor.ts b/src/core/editor/components/rich-text-editor/rich-text-editor.ts
index dc79617c3..c619aaf00 100644
--- a/src/core/editor/components/rich-text-editor/rich-text-editor.ts
+++ b/src/core/editor/components/rich-text-editor/rich-text-editor.ts
@@ -230,7 +230,7 @@ export class CoreEditorRichTextEditorComponent implements AfterContentInit, OnDe
}
if (height > this.minHeight) {
- this.element.style.height = this.domUtils.formatPixelsSize(height);
+ this.element.style.height = this.domUtils.formatPixelsSize(height - 1);
} else {
this.element.style.height = '';
}
@@ -583,10 +583,23 @@ export class CoreEditorRichTextEditorComponent implements AfterContentInit, OnDe
}
}
+ /**
+ * Focus editor when click the area.
+ *
+ * @param e Event
+ */
+ focusRTE(e?: Event): void {
+ if (this.rteEnabled) {
+ this.editorElement.focus();
+ } else {
+ this.textarea.setFocus();
+ }
+ }
+
/**
* Hide the toolbar in phone mode.
*/
- hideToolbar($event: any): void {
+ hideToolbar($event: Event): void {
this.stopBubble($event);
if (this.isPhone) {