Fairoj : Merge Changes

ng8-seed/src/app/dashboard/dashboard.component.html

@@ -6,7 +6,7 @@
       <!-- <div class="container"> -->
          <div fxLayout="column" fxLayoutAlign="center">
             <!-- <div fxFlex="100"> -->
-               <div style="margin: 0px;" fxLayoutAlign="center"  fxFlex="10">
+               <div  fxLayoutAlign="center"  fxFlex="10">
                <h5 class="flex-text">There is no exercise better for the heart than reaching down and lifting people up.</h5>
             </div>
             <!-- </div> -->

ng8-seed/src/app/dashboard/dashboard.component.scss

@@ -69,24 +69,25 @@ $p: 12px;
     }
 }
 .mc-2{
-    z-index: 4;
+    z-index: 1;
     background-color: rgba(0,190,214,0.9);
 }
 .mc-3{
     background-color: rgba(0,165,228,0.9);
-    z-index: 4;
+    z-index: auto;
+    position: relative;
 }
 .mc-4{
     background-color: rgba(0,136,223,0.9);
-    z-index: 4;
+    z-index: 1;
 }
 .mc-5{
     background-color: rgba(111,99,195,0.9);
-    z-index: 4;
+    z-index: 1;
 }
 .mc-6{
     background-color: rgba(255,198,88,0.9);
-    z-index: 4;
+    z-index: 1;
 }
 .mc-7{
     background-color: rgba(255,148,92,0.9);
@@ -108,13 +109,14 @@ $p: 12px;
     color:white;
     font-style: oblique;
     font-size: 22px;
-    z-index: 2;
+    position:relative;
+    z-index: auto;
 }
 .flex-text2{
     color:white;
     font-style: oblique;
     font-size: 18px;
-    z-index: 2;
+    z-index: auto;
 }
 .form-bg{
     height: 80vh;

ng8-seed/src/app/layouts/admin/admin-layout.component.html

@@ -56,7 +56,7 @@
                   </a>
                   <mat-nav-list class="sub-menu" *ngIf="menuitem.type === 'sub'">
                      <mat-list-item *ngFor="let childitem of menuitem.children" routerLinkActive="open">
-                        <a [routerLink]="['/', menuitem.state, childitem.state ]" class="relative" mat-ripple>{{ childitem.name | translate }}</a>
+                        <a [routerLink]="['/'+childitem.state ]" class="relative" mat-ripple>{{ childitem.name | translate }}</a>
                      </mat-list-item>
                   </mat-nav-list>
                </mat-list-item>

ng8-seed/src/app/shared/menu-items/horizontal-menu-items.ts

@@ -28,9 +28,15 @@ const HORIZONTALMENUITEMS = [
     type: 'link',
     icon: 'home'
   },
+  {
+    state: 'contribute',
+    name: 'Contribute',
+    type: 'link',
+    icon: 'error_outline'
+  },
   {
     state: 'apps',
-    name: 'Components',
+    name: 'Pages',
     type: 'sub',
     icon: 'apps',
     children: [

ng8-seed/src/app/shared/menu-items/menu-items.ts

@@ -62,11 +62,29 @@ const MENUITEMS : Menu[] = [
     icon: 'error_outline'
   },
   {
-    state: 'payment',
-    name: 'Payment',
-    type: 'link',
-    icon: 'error_outline'
+    state: 'apps',
+    name: 'Pages',
+    type: 'sub',
+    icon: 'apps',
+    children: [
+      {state: 'contribute', name: 'Contribute',},
+      {state: 'projects', name: 'Projects',},
+      {state: 'payment', name: 'Payment'},
+      {state: 'paymentconfirmation', name: 'PaymentConfirmation'}
+    ]
   },
+  {
+    state: 'my-account',
+    name: 'My-Account',
+    type: 'link',
+    icon: 'person'
+  },
+  // {
+  //   state: 'payment',
+  //   name: 'Payment',
+  //   type: 'link',
+  //   icon: 'error_outline'
+  // },
   {
     state: 'authentication',
     name: 'Login',

ng8-seed/src/assets/styles/scss/core/_main-panel.scss

@@ -126,17 +126,19 @@ $mat-toolbar-height-mobile-landscape: 48px !default;
                 position: relative;
             }
             .dropdown {
-                position: absolute;
-                opacity: 0;
+                position: fixed;
+                z-index: 5;
+                opacity: 1;
                 visibility: hidden;
-                width: 200px;
+                // width: 200px;
                 transition: all 0.2s ease-in-out 0s;
                 transform: translateY(-20px);
                 background: #fff;
+                color:black;
                 padding: 0;
                 list-style: none;
                 text-align: left;
-                z-index: 9;
+               
                 box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
                 a {
                     padding: 0.5rem 1rem;
@@ -147,7 +149,9 @@ $mat-toolbar-height-mobile-landscape: 48px !default;
                 }
                 li:hover {
                     >.dropdown {
-                        opacity: 1;
+                        // opacity: 100;
+                        position: relative;
+                        z-index: 9;
                         visibility: visible;
                           transform: translateY(0px);
                     }

ng8-seed/src/assets/styles/scss/core/_main-sidebar.scss

@@ -43,6 +43,7 @@
             color: $sidebar-menu-color;
         }
         .sub-menu {
+            
             padding-top: 0;
             overflow: hidden;
             -webkit-transition: .5s cubic-bezier(.35, 0, .25, 1);
@@ -51,6 +52,7 @@
             -webkit-transition-property: max-height;
             -moz-transition-property: max-height;
             transition-property: max-height;
+            
         }
         .sub-menu a {
             @include padding-left(64px);