feat(@theme): add base footer

src/app/@theme/layouts/base-footer/_base-footer.component.theme.scss

@@ -0,0 +1,9 @@
+@mixin base-footer-theme() {
+  /deep/ base-footer {
+    color: $nga-color-default;
+
+    .socials a:hover {
+      color: $nga-color-secondary !important;
+    }
+  }
+}

src/app/@theme/layouts/base-footer/base-footer.component.scss

@@ -0,0 +1,14 @@
+:host {
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  .socials {
+    font-size: 2rem;
+
+    a {
+      padding: .4rem;
+    }
+  }
+}

src/app/@theme/layouts/base-footer/base-footer.component.ts

@@ -0,0 +1,17 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'base-footer',
+  styleUrls: ['./base-footer.component.scss'],
+  template: `
+    <span>Created with ♥ by <b>Akveo</b> 2017</span>
+    <div class="socials">
+      <a href="https://github.com/akveo" target="_blank" class="ion ion-social-github"></a>
+      <a href="https://www.facebook.com/akveo" target="_blank" class="ion ion-social-facebook"></a>
+      <a href="https://twitter.com/akveo_inc" target="_blank" class="ion ion-social-twitter"></a>
+      <a href="https://www.linkedin.com/company/akveo" target="_blank" class="ion ion-social-linkedin"></a>
+    </div>
+  `
+})
+export class BaseFooterComponent {
+}

src/app/@theme/layouts/base-header/base-header.component.scss

@@ -58,7 +58,6 @@
         padding-right: 0;
       }
     }
-
   }
 }
 

src/app/@theme/layouts/one-coll-layout/one-coll.layout.ts

@@ -19,6 +19,7 @@ import { Component } from '@angular/core';
       </nga-layout-column>
 
       <nga-layout-footer fixed>
+        <base-footer></base-footer>
       </nga-layout-footer>
     </nga-layout>
   `,

src/app/@theme/styles/_components.scss

@@ -0,0 +1,9 @@
+@import '../layouts/base-header/base-header.component.theme';
+@import '../search-input/search-input.component.theme';
+@import '../layouts/base-footer/base-footer.component.theme';
+
+@mixin custom-components-theme() {
+  @include base-header-theme();
+  @include base-footer-theme();
+  @include search-input-theme();
+}

src/app/@theme/styles/pure/_pure.components.scss

@@ -1,7 +0,0 @@
-@import '../../layouts/base-header/base-header.component.theme';
-@import '../../search-input/search-input.component.theme';
-
-@mixin custom-components-theme() {
-  @include base-header-theme();
-  @include search-input-theme();
-}

src/app/@theme/styles/pure/_pure.redefines.scss

@@ -30,6 +30,10 @@ $nga-sidebar-width-compact: 3.45rem;
     color: $nga-color-default;
   }
 
+  a:hover {
+    color: $nga-color-secondary;
+  }
+
   nga-layout {
     nga-layout-header > nav {
       box-shadow: 0 4px 12px 0 rgba(33, 57, 161, 0.08);
@@ -66,6 +70,7 @@ $nga-sidebar-width-compact: 3.45rem;
     nga-layout-footer > nav {
       box-shadow: 0 4px 12px 0 rgba(33, 57, 161, 0.08);
       border: none !important;
+      padding: 1.25rem;
     }
   }
 }

src/app/@theme/styles/pure/pure.theme.scss

@@ -1,5 +1,5 @@
 @import '~@nga/theme/styles/themes/nga.theme.default';
-@import 'pure.components';
+@import '../components';
 @import 'pure.redefines';
 
 @include nga-theme();

src/app/@theme/theme.module.ts

@@ -14,6 +14,7 @@ import {
 
 import { SearchInputComponent } from './search-input/search-input.component';
 import { OneCollLayoutComponent, BaseHeaderComponent } from './layouts';
+import { BaseFooterComponent } from './layouts/base-footer/base-footer.component';
 
 const BASE_MODULES = [
   CommonModule,
@@ -32,7 +33,8 @@ const NGA_MODULES = [
 
 const LAYOUTS = [
   OneCollLayoutComponent,
-  BaseHeaderComponent
+  BaseHeaderComponent,
+  BaseFooterComponent
 ];
 
 @NgModule({
@@ -49,7 +51,8 @@ const LAYOUTS = [
   ],
   declarations: [
     ...LAYOUTS,
-    SearchInputComponent
+    SearchInputComponent,
+    BaseFooterComponent
   ]
 })
 export class ThemeModule {

src/app/pages/pages.component.ts

@@ -1,19 +1,13 @@
 import { Component } from '@angular/core';
 
-import { List } from 'immutable';
-
-import { menuItems } from './pages-menu';
-import { NgaMenuItem } from '@nga/theme/components/menu/menu.options';
-
 @Component({
   selector: 'pages',
   template: `
     <one-coll-layout>
-      <nga-menu [menuItems]="menuItems"></nga-menu>
+      <nga-menu></nga-menu>
       <router-outlet></router-outlet>
     </one-coll-layout>
   `
 })
 export class PagesComponent {
-  menuItems: List<NgaMenuItem> = menuItems;
 }

src/app/pages/pages.module.ts

@@ -5,6 +5,8 @@ import {
   NgaMenuModule
 } from '@nga/theme';
 
+import { menuItems } from './pages-menu';
+
 import { PagesComponent } from './pages.component';
 import { DashboardComponent } from './dashboard/dashboard.component';
 import { PagesRoutingModule } from './pages-routing.module';
@@ -16,7 +18,9 @@ import { ComponentsComponent } from './components/components.component';
 @NgModule({
   imports: [
     NgaSidebarModule.forRoot(),
-    NgaMenuModule.forRoot(),
+    NgaMenuModule.forRoot({
+      items: menuItems
+    }),
     PagesRoutingModule,
     ThemeModule
   ],