1 files changed, 23 insertions, 2 deletions

diff --git a/src/app/error-message/error-message.component.html b/src/app/error-message/error-message.component.html
index fc7cc10..a481548 100644
--- a/src/app/error-message/error-message.component.html
+++ b/src/app/error-message/error-message.component.html
@@ -1,7 +1,28 @@
 
-<div *ngIf="messages.getError()" class="c-error u-mb-x2">
+<div *ngIf="messages.getError()" class="c-alert c-alert--error u-mb-x2">
   <div class="o-media">
     <span class="o-media__fixed u-text-left">Error: {{messages.getError()}}</span>
-    <a class="o-media__fluid u-text-right c-link" (click)="dismissError()">X</a>
+    <a class="o-media__fluid u-text-right c-link" (click)="messages.dismissError()">X</a>
+  </div>
+</div>
+
+<div *ngIf="messages.getWarning()" class="c-alert c-alert--warning u-mb-x2">
+  <div class="o-media">
+    <span class="o-media__fixed u-text-left">Warning: {{messages.getWarning()}}</span>
+    <a class="o-media__fluid u-text-right c-link" (click)="messages.dismissWarning()">X</a>
+  </div>
+</div>
+
+<div *ngIf="messages.getSuccess()" class="c-alert c-alert--success u-mb-x2">
+  <div class="o-media">
+    <span class="o-media__fixed u-text-left">Success: {{messages.getSuccess()}}</span>
+    <a class="o-media__fluid u-text-right c-link" (click)="messages.dismissSuccess()">X</a>
+  </div>
+</div>
+
+<div *ngIf="messages.getInformation()" class="c-alert c-alert--information u-mb-x2">
+  <div class="o-media">
+    <span class="o-media__fixed u-text-left">Information: {{messages.getInformation()}}</span>
+    <a class="o-media__fluid u-text-right c-link" (click)="messages.dismissInformation()">X</a>
   </div>
 </div>