From 0e359a1be149ffa1e349b2dbb89d47f6c88c234e Mon Sep 17 00:00:00 2001
From: Dani Palou <dani@moodle.com>
Date: Thu, 21 Jun 2018 16:29:41 +0200
Subject: [PATCH] MOBILE-2431 error: Fix wifi icon in network errors

---
 src/app/app.scss           | 21 ++++++++++++++++++++-
 src/providers/utils/dom.ts | 14 +++++++++-----
 2 files changed, 29 insertions(+), 6 deletions(-)

diff --git a/src/app/app.scss b/src/app/app.scss
index 540da822e..dadf2360d 100644
--- a/src/app/app.scss
+++ b/src/app/app.scss
@@ -795,4 +795,23 @@ ion-alert.core-inapp-notification {
       margin-bottom: 5px;
     }
   }
-}
\ No newline at end of file
+}
+
+.core-icon-with-badge {
+  position: relative;
+
+  .icon {
+    font-size: 32px;
+  }
+
+  .core-icon-badge {
+    width: auto;
+    height: auto;
+    margin: 0;
+    position: absolute;
+    top: -18px;
+    right: -8px;
+    color: red;
+    font-size: 16px;
+  }
+}
diff --git a/src/providers/utils/dom.ts b/src/providers/utils/dom.ts
index 3d2ce47d6..3ab14f2a9 100644
--- a/src/providers/utils/dom.ts
+++ b/src/providers/utils/dom.ts
@@ -17,6 +17,7 @@ import {
     LoadingController, Loading, ToastController, Toast, AlertController, Alert, Platform, Content,
     ModalController
 } from 'ionic-angular';
+import { DomSanitizer } from '@angular/platform-browser';
 import { TranslateService } from '@ngx-translate/core';
 import { CoreTextUtilsProvider } from './text';
 import { CoreAppProvider } from '../app';
@@ -42,7 +43,7 @@ export class CoreDomUtilsProvider {
     constructor(private translate: TranslateService, private loadingCtrl: LoadingController, private toastCtrl: ToastController,
             private alertCtrl: AlertController, private textUtils: CoreTextUtilsProvider, private appProvider: CoreAppProvider,
             private platform: Platform, private configProvider: CoreConfigProvider, private urlUtils: CoreUrlUtilsProvider,
-            private modalCtrl: ModalController) { }
+            private modalCtrl: ModalController, private sanitizer: DomSanitizer) { }
 
     /**
      * Equivalent to element.closest(). If the browser doesn't support element.closest, it will
@@ -474,13 +475,16 @@ export class CoreDomUtilsProvider {
      * Given an error message, return a suitable error title.
      *
      * @param {string} message The error message.
-     * @return {string} Title.
+     * @return {any} Title.
      */
-    private getErrorTitle(message: string): string {
+    private getErrorTitle(message: string): any {
         if (message == this.translate.instant('core.networkerrormsg') ||
             message == this.translate.instant('core.fileuploader.errormustbeonlinetoupload')) {
-            return '<span class="core-icon-with-badge"><i class="icon ion-wifi"></i>\
-                <i class="icon ion-alert-circled core-icon-badge"></i></span>';
+            return this.sanitizer.bypassSecurityTrustHtml('<div text-center><span class="core-icon-with-badge">' +
+                    '<ion-icon role="img" class="icon fa fa-wifi" aria-label="wifi"></ion-icon>' +
+                    '<ion-icon class="icon fa fa-exclamation-triangle core-icon-badge"></ion-icon>' +
+                '</span></div>');
+
         }
 
         return this.textUtils.decodeHTML(this.translate.instant('core.error'));