-
-
-
+
diff --git a/src/ui_ng/src/app/global-message/message.component.css b/src/ui_ng/src/app/global-message/message.component.css
new file mode 100644
index 000000000..b19958e3f
--- /dev/null
+++ b/src/ui_ng/src/app/global-message/message.component.css
@@ -0,0 +1,7 @@
+.global-message-alert {
+ position: fixed;
+ top: 60px;
+ left: 0px;
+ width: 100%;
+ z-index: 9999;
+}
\ No newline at end of file
diff --git a/src/ui_ng/src/app/global-message/message.component.html b/src/ui_ng/src/app/global-message/message.component.html
index 2859e90a1..349f4b762 100644
--- a/src/ui_ng/src/app/global-message/message.component.html
+++ b/src/ui_ng/src/app/global-message/message.component.html
@@ -1,10 +1,12 @@
-
-
-
+
+
+
+
{{message}}
-
-
+
+
+
-
-
\ No newline at end of file
+
+
\ No newline at end of file
diff --git a/src/ui_ng/src/app/global-message/message.component.ts b/src/ui_ng/src/app/global-message/message.component.ts
index d551e35bb..5e10ddb52 100644
--- a/src/ui_ng/src/app/global-message/message.component.ts
+++ b/src/ui_ng/src/app/global-message/message.component.ts
@@ -11,7 +11,7 @@
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
-import { Component, Input, OnInit, OnDestroy } from '@angular/core';
+import { Component, Input, OnInit, OnDestroy, ElementRef } from '@angular/core';
import { Router } from '@angular/router';
import { Subscription } from 'rxjs/Subscription';
import { TranslateService } from '@ngx-translate/core';
@@ -23,7 +23,8 @@ import { AlertType, dismissInterval, httpStatusCode, CommonRoutes } from '../sha
@Component({
selector: 'global-message',
- templateUrl: 'message.component.html'
+ templateUrl: 'message.component.html',
+ styleUrls: ['message.component.css']
})
export class MessageComponent implements OnInit, OnDestroy {
@@ -32,12 +33,14 @@ export class MessageComponent implements OnInit, OnDestroy {
globalMessageOpened: boolean;
messageText: string = "";
timer: any = null;
+ hideOuter: boolean = true;
appLevelMsgSub: Subscription;
msgSub: Subscription;
clearSub: Subscription;
constructor(
+ private elementRef: ElementRef,
private messageService: MessageService,
private router: Router,
private translate: TranslateService) { }
@@ -67,6 +70,19 @@ export class MessageComponent implements OnInit, OnDestroy {
// Make the message alert bar dismiss after several intervals.
//Only for this case
this.timer = setTimeout(() => this.onClose(), dismissInterval);
+
+ //Hack the Clarity Alert style with native dom
+ setTimeout(() => {
+ let nativeDom: any = this.elementRef.nativeElement;
+ let queryDoms: any[] = nativeDom.getElementsByClassName("alert");
+ if (queryDoms && queryDoms.length > 0) {
+ let hackDom: any = queryDoms[0];
+ hackDom.className += ' alert-global alert-global-align';
+ }
+
+ this.hideOuter = false;
+ }, 0);
+
}
);
}
@@ -122,5 +138,6 @@ export class MessageComponent implements OnInit, OnDestroy {
clearTimeout(this.timer);
}
this.globalMessageOpened = false;
+ this.hideOuter = true;
}
}
\ No newline at end of file
diff --git a/src/ui_ng/src/app/shared/shared.const.ts b/src/ui_ng/src/app/shared/shared.const.ts
index 687512420..f0e7355e2 100644
--- a/src/ui_ng/src/app/shared/shared.const.ts
+++ b/src/ui_ng/src/app/shared/shared.const.ts
@@ -22,7 +22,7 @@ export const enum AlertType {
DANGER, WARNING, INFO, SUCCESS
};
-export const dismissInterval = 15 * 1000;
+export const dismissInterval = 10 * 1000;
export const httpStatusCode = {
"Unauthorized": 401,
"Forbidden": 403
diff --git a/src/ui_ng/src/styles.css b/src/ui_ng/src/styles.css
index a2f595bf9..cc0ee8f2d 100644
--- a/src/ui_ng/src/styles.css
+++ b/src/ui_ng/src/styles.css
@@ -6,4 +6,26 @@
margin-left: -54px;
width: 108px !important;
height: 108px !important;
+}
+
+
+/*Hack Clarity alert*/
+
+.alert-global {
+ font-size: 16px;
+ font-weight: 400;
+ font-family: Metropolis, "Avenir Next", "Helvetica Neue", Arial, sans-serif;
+ padding: 12px !important;
+ border: none !important;
+ margin-top: 0px !important;
+ max-height: 96px;
+}
+
+.alert-global-align {
+ -webkit-box-pack: center;
+ justify-content: center;
+ -webkit-box-align: center;
+ align-items: center;
+ overflow-y: auto;
+ overflow-x: hidden;
}
\ No newline at end of file