style added for selected menu

src/app/app.component.ts

@@ -24,6 +24,7 @@ export class MyApp {
     rootPage: any = LoginPage;
     homePage: any = HomePage;
     entries: Array<{ visible: boolean, title: string, pages: Array<{ visible: boolean, title: string, icon: string, component: any, params?: any }> }>;
+    activePage: any;
     loader: Loading;
 
     constructor(
@@ -179,6 +180,14 @@ export class MyApp {
      *
      */
     openPage(page) {
+        this.activePage = page;
         this.nav.setRoot(page.component, page);
     }
+
+    /**
+     * 
+     */
+    getActivePage(): any {
+        return this.activePage;
+    }
 }

src/app/app.html

@@ -14,7 +14,7 @@
 
             <div *ngFor="let e of (entries | menu: true)">
                 <ion-list-header>{{ e.title }}</ion-list-header>
-                <button ion-item menuClose *ngFor="let p of (e.pages | menu: true)" (click)="openPage(p)">
+                <button ion-item menuClose *ngFor="let p of (e.pages | menu: true)" (click)="openPage(p)" [ngClass]="{ 'selected-menu': p === getActivePage() }">
                     <ion-icon color="primary" name="{{ p.icon }}" style="padding-right: 20px;"></ion-icon>
                     {{ p.title }}
                 </button>

src/app/app.scss

@@ -19,6 +19,10 @@ ion-fab > button {
     background: $button-color !important;
 }
 
+ion-list > div > ion-list-header {
+    margin-bottom: 0px !important;
+}
+
 p {
     word-break: keep-all;
     white-space: normal;
@@ -29,6 +33,11 @@ p {
     border-radius: 30px 0px;
 }
 
+.selected-menu {
+    background-color: #f1f1f1;
+    border-radius: 20px 0px 0px 20px;
+}
+
 // body.menu-open .side-menu-open {
 //     transform: translate3d(275px, 0px, 0px) scale(.9) !important;
 //     opacity: 0.9;