diff --git a/src/app/pages/components/components-routing.module.ts b/src/app/pages/components/components-routing.module.ts
index 7a3f4d51..655666d8 100644
--- a/src/app/pages/components/components-routing.module.ts
+++ b/src/app/pages/components/components-routing.module.ts
@@ -3,7 +3,7 @@ import { Routes, RouterModule } from '@angular/router';
 
 import { ComponentsComponent } from './components.component';
 import { TreeComponent } from './tree/tree.component';
-import { ToasterComponent } from './toaster/toaster.component';
+import { NotificationsComponent } from './notifications/notifications.component';
 
 const routes: Routes = [{
   path: '',
@@ -13,8 +13,8 @@ const routes: Routes = [{
     path: 'tree',
     component: TreeComponent,
   }, {
-    path: 'toaster',
-    component: ToasterComponent,
+    path: 'notifications',
+    component: NotificationsComponent,
   },
   ],
 }];
@@ -28,5 +28,5 @@ export class ComponentsRoutingModule { }
 export const routedComponents = [
   ComponentsComponent,
   TreeComponent,
-  ToasterComponent,
+  NotificationsComponent,
 ];
diff --git a/src/app/pages/components/toaster/toaster.component.html b/src/app/pages/components/notifications/notifications.component.html
similarity index 99%
rename from src/app/pages/components/toaster/toaster.component.html
rename to src/app/pages/components/notifications/notifications.component.html
index ab12e756..183c08c5 100644
--- a/src/app/pages/components/toaster/toaster.component.html
+++ b/src/app/pages/components/notifications/notifications.component.html
@@ -4,6 +4,7 @@
   </nga-card-header>
   <nga-card-body>
     <toaster-container [toasterconfig]="config"></toaster-container>
+
     <div class="form-group">
       <label class="form-control-label">Place to show toast:</label>
       <select class="form-control" [(ngModel)]="position" name="position">
diff --git a/src/app/pages/components/toaster/toaster.component.scss b/src/app/pages/components/notifications/notifications.component.scss
similarity index 100%
rename from src/app/pages/components/toaster/toaster.component.scss
rename to src/app/pages/components/notifications/notifications.component.scss
diff --git a/src/app/pages/components/toaster/toaster.component.ts b/src/app/pages/components/notifications/notifications.component.ts
similarity index 86%
rename from src/app/pages/components/toaster/toaster.component.ts
rename to src/app/pages/components/notifications/notifications.component.ts
index 4b8b1db9..c06a0152 100644
--- a/src/app/pages/components/toaster/toaster.component.ts
+++ b/src/app/pages/components/notifications/notifications.component.ts
@@ -1,14 +1,14 @@
 import { Component } from '@angular/core';
 import { ToasterService, ToasterConfig, Toast } from 'angular2-toaster';
 
-import 'style-loader!angular2-toaster/toaster.css';
+// import 'style-loader!angular2-notifications/notifications.css';
 
 @Component({
-  selector: 'ngx-toasters',
-  styleUrls: ['toaster.component.scss'],
-  templateUrl: 'toaster.component.html',
+  selector: 'ngx-notifications',
+  styleUrls: ['./notifications.component.scss'],
+  templateUrl: './notifications.component.html',
 })
-export class ToasterComponent {
+export class NotificationsComponent {
   constructor(private toasterService: ToasterService) {}
 
   title: string = 'HI there!';
diff --git a/src/app/pages/pages-menu.ts b/src/app/pages/pages-menu.ts
index 47e858d3..9bf0173a 100644
--- a/src/app/pages/pages-menu.ts
+++ b/src/app/pages/pages-menu.ts
@@ -57,7 +57,7 @@ export const MENU_ITEMS: List<NgaMenuItem> = List([
         link: '/pages/components/tree',
       }, {
         title: 'Toaster',
-        link: '/pages/components/toaster',
+        link: '/pages/components/notifications',
       },
     ]),
   },