From d727c5362167d2f519ed2dbdfe73a2a4f45bda53 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Fri, 18 Mar 2022 16:20:56 +0100
Subject: [PATCH] MOBILE-3814 rte: Fix hover style on rte item

---
 .../rich-text-editor/rich-text-editor.ts      | 22 +++++++++----------
 src/theme/theme.base.scss                     |  4 ++--
 2 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/src/core/features/editor/components/rich-text-editor/rich-text-editor.ts b/src/core/features/editor/components/rich-text-editor/rich-text-editor.ts
index c152c6c41..e13862358 100644
--- a/src/core/features/editor/components/rich-text-editor/rich-text-editor.ts
+++ b/src/core/features/editor/components/rich-text-editor/rich-text-editor.ts
@@ -20,7 +20,6 @@ import {
     ViewChild,
     ElementRef,
     OnInit,
-    AfterContentInit,
     OnDestroy,
     Optional,
     AfterViewInit,
@@ -56,7 +55,7 @@ import { CoreCancellablePromise } from '@classes/cancellable-promise';
     templateUrl: 'core-editor-rich-text-editor.html',
     styleUrls: ['rich-text-editor.scss'],
 })
-export class CoreEditorRichTextEditorComponent implements OnInit, AfterContentInit, AfterViewInit, OnDestroy {
+export class CoreEditorRichTextEditorComponent implements OnInit, AfterViewInit, OnDestroy {
 
     // Based on: https://github.com/judgewest2000/Ionic3RichText/
     // @todo: Anchor button, fullscreen...
@@ -149,7 +148,7 @@ export class CoreEditorRichTextEditorComponent implements OnInit, AfterContentIn
     }
 
     /**
-     * Component being initialized.
+     * @inheritdoc
      */
     ngOnInit(): void {
         this.canScanQR = CoreUtils.canScanQR();
@@ -159,9 +158,9 @@ export class CoreEditorRichTextEditorComponent implements OnInit, AfterContentIn
     }
 
     /**
-     * Init editor.
+     * @inheritdoc
      */
-    async ngAfterContentInit(): Promise<void> {
+    async ngAfterViewInit(): Promise<void> {
         this.rteEnabled = await CoreDomUtils.isRichTextEditorEnabled();
 
         await this.waitLoadingsDone();
@@ -202,13 +201,14 @@ export class CoreEditorRichTextEditorComponent implements OnInit, AfterContentIn
 
             this.deleteDraftOnSubmitOrCancel();
         }
-    }
 
-    /**
-     * @inheritdoc
-     */
-    async ngAfterViewInit(): Promise<void> {
-        const label = this.element.closest('ion-item')?.querySelector('ion-label');
+        const ionItem = this.element.closest<HTMLIonItemElement>('ion-item');
+        if (!ionItem) {
+            return;
+        }
+        ionItem.classList.add('item-rte');
+
+        const label = ionItem.querySelector('ion-label');
 
         if (!label) {
             return;
diff --git a/src/theme/theme.base.scss b/src/theme/theme.base.scss
index 791f5022e..b60b71e4e 100644
--- a/src/theme/theme.base.scss
+++ b/src/theme/theme.base.scss
@@ -1255,7 +1255,7 @@ ion-datetime.datetime-disabled {
 
 // Make links clickable when inside radio or checkbox items. Style part.
 @media (hover: hover) {
-    ion-item.item-multiple-inputs:hover::part(native) {
+    ion-item.item-multiple-inputs:not(.item-rte):hover::part(native) {
         color: var(--color-hover);
 
         &::after {
@@ -1276,7 +1276,7 @@ ion-datetime.datetime-disabled {
 
 // It fixes the click on links where ion-ripple-effect is present.
 // Make links clickable when inside radio or checkbox items. Pointer and cursor part.
-ion-item.item-multiple-inputs:not(.only-links),
+ion-item.item-multiple-inputs:not(.only-links):not(.item-rte),
 ion-item.ion-activatable:not(.only-links) {
     cursor: pointer;
     ion-label {