diff --git a/.angular-cli.json b/.angular-cli.json index 58f21cdf..cc259347 100644 --- a/.angular-cli.json +++ b/.angular-cli.json @@ -17,7 +17,6 @@ "test": "test.ts", "tsconfig": "tsconfig.app.json", "testTsconfig": "tsconfig.spec.json", - "prefix": "app", "styles": [ "../node_modules/normalize.css/normalize.css", "../node_modules/font-awesome/scss/font-awesome.scss", diff --git a/src/app/@theme/layouts/base-footer/base-footer.component.scss b/src/app/@theme/layouts/base-footer/base-footer.component.scss index d5180b32..8c8ad6e9 100644 --- a/src/app/@theme/layouts/base-footer/base-footer.component.scss +++ b/src/app/@theme/layouts/base-footer/base-footer.component.scss @@ -8,7 +8,7 @@ font-size: 2rem; a { - padding: .4rem; + padding: 0.4rem; } } } \ No newline at end of file diff --git a/src/app/@theme/layouts/base-footer/base-footer.component.ts b/src/app/@theme/layouts/base-footer/base-footer.component.ts index 5e85605a..2957a003 100644 --- a/src/app/@theme/layouts/base-footer/base-footer.component.ts +++ b/src/app/@theme/layouts/base-footer/base-footer.component.ts @@ -11,7 +11,7 @@ import { Component } from '@angular/core'; - ` + `, }) export class BaseFooterComponent { } diff --git a/src/app/@theme/layouts/base-header/base-header.component.scss b/src/app/@theme/layouts/base-header/base-header.component.scss index eaf7def2..794f96a9 100644 --- a/src/app/@theme/layouts/base-header/base-header.component.scss +++ b/src/app/@theme/layouts/base-header/base-header.component.scss @@ -4,7 +4,7 @@ justify-content: space-between; i.control-icon { - &:before { + &::before { font-size: 2.3rem; } @@ -47,6 +47,7 @@ font-size: 1.7rem; text-decoration: none; transition: all 0.2s ease; + cursor: pointer; } } diff --git a/src/app/@theme/layouts/base-header/base-header.component.ts b/src/app/@theme/layouts/base-header/base-header.component.ts index 97cbc7a4..df07c4f3 100644 --- a/src/app/@theme/layouts/base-header/base-header.component.ts +++ b/src/app/@theme/layouts/base-header/base-header.component.ts @@ -1,6 +1,6 @@ import { Component } from '@angular/core'; -import { NgaSidebarService } from '@nga/theme/components/sidebar/sidebar.service'; +import { NgaSidebarService, NgaMenuService } from '@nga/theme'; @Component({ selector: 'base-header', @@ -8,7 +8,7 @@ import { NgaSidebarService } from '@nga/theme/components/sidebar/sidebar.service template: `
- +
@@ -17,13 +17,18 @@ import { NgaSidebarService } from '@nga/theme/components/sidebar/sidebar.service
- ` + `, }) export class BaseHeaderComponent { - constructor(private sidebarService: NgaSidebarService) { + constructor(private sidebarService: NgaSidebarService, + private menuService: NgaMenuService) { } toggleSidebar() { this.sidebarService.toggle(true); } + + goToHome() { + this.menuService.navigateHome(); + } } diff --git a/src/app/@theme/layouts/one-coll-layout/one-coll.layout.ts b/src/app/@theme/layouts/one-coll-layout/one-coll.layout.ts index 15a3b059..c6b54794 100644 --- a/src/app/@theme/layouts/one-coll-layout/one-coll.layout.ts +++ b/src/app/@theme/layouts/one-coll-layout/one-coll.layout.ts @@ -9,9 +9,7 @@ import { Component } from '@angular/core'; - - - + diff --git a/src/app/@theme/search-input/search-input.component.ts b/src/app/@theme/search-input/search-input.component.ts index 3196b41e..d70c22e3 100644 --- a/src/app/@theme/search-input/search-input.component.ts +++ b/src/app/@theme/search-input/search-input.component.ts @@ -11,7 +11,7 @@ import { Component, ElementRef, EventEmitter, Output, ViewChild } from '@angular [class.hidden]="!isInputShown" (blur)="hideInput()" (input)="onInput($event)"> - ` + `, }) export class SearchInputComponent { @ViewChild('input') input: ElementRef; @@ -32,4 +32,4 @@ export class SearchInputComponent { onInput(val: string) { this.search.emit(val); } -} \ No newline at end of file +} diff --git a/src/app/@theme/styles/pure/_pure.redefines.scss b/src/app/@theme/styles/pure/_pure.redefines.scss deleted file mode 100644 index 04738c71..00000000 --- a/src/app/@theme/styles/pure/_pure.redefines.scss +++ /dev/null @@ -1,82 +0,0 @@ -@import '~@nga/theme/styles/themes/nga.theme.default'; - -$nga-color-primary: #edf1f7; -$nga-color-default: #7d85b2; -$nga-color-secondary: #b5bbd5; - -$nga-background: white; - -$nga-layout-background: $nga-color-primary; -$nga-layout-foreground: $nga-color-default; - -$nga-header-height: 4.725rem; -$nga-header-background: $nga-background; -$nga-header-foreground: $nga-color-default; -$nga-header-padding: 1.25rem; - -$nga-footer-height: $nga-header-height; -$nga-footer-background: $nga-background; - -$nga-user-picture-background: $nga-color-default; - -$nga-sidebar-background: $nga-background; -$nga-sidebar-width: 16.25rem; -$nga-sidebar-width-compact: 3.45rem; - -:host /deep/ { - color: $nga-color-default; - - input { - color: $nga-color-default; - } - - a:hover { - color: $nga-color-secondary; - text-decoration: none; - } - - nga-layout { - nga-layout-header > nav { - box-shadow: 0 4px 12px 0 rgba(33, 57, 161, 0.08); - } - - nga-sidebar { - box-shadow: 0 4px 12px 0 rgba(33, 57, 161, 0.08); - - ul li a { - display: flex; - align-items: center; - - transition: all 0.2s ease; - padding: .375rem 0 .375rem 1rem; - - &:hover { - background: $nga-color-primary; - color: $nga-color-default; - } - - &.active { - font-weight: bold; - color: $nga-color-default; - background: $nga-color-primary; - } - - i { - font-size: 2rem; - margin-right: 1.25rem; - - &:first-child { - display: flex; - justify-content: center; - } - } - } - } - - nga-layout-footer > nav { - box-shadow: 0 4px 12px 0 rgba(33, 57, 161, 0.08); - border: none !important; - padding: 1.25rem; - } - } -} diff --git a/src/app/@theme/styles/pure/_pure.variables.scss b/src/app/@theme/styles/pure/_pure.variables.scss new file mode 100644 index 00000000..0be81a60 --- /dev/null +++ b/src/app/@theme/styles/pure/_pure.variables.scss @@ -0,0 +1,23 @@ +$nga-color-primary: #edf1f7; +$nga-color-default: #7d85b2; +$nga-color-secondary: #b5bbd5; + +$nga-background: white; + +$nga-layout-background: $nga-color-primary; +$nga-layout-foreground: $nga-color-default; + +$nga-header-height: 4.725rem; +$nga-header-background: $nga-background; +$nga-header-foreground: $nga-color-default; +$nga-header-padding: 1.25rem; + +$nga-footer-height: $nga-header-height; +$nga-footer-background: $nga-background; + +$nga-user-picture-background: $nga-color-default; + +$nga-sidebar-background: $nga-background; +$nga-sidebar-width: 16.25rem; +$nga-sidebar-width-compact: 3.45rem; +$nga-sidebar-padding: 0; \ No newline at end of file diff --git a/src/app/@theme/styles/pure/pure.theme.scss b/src/app/@theme/styles/pure/pure.theme.scss index 27d33a7a..43dd5955 100644 --- a/src/app/@theme/styles/pure/pure.theme.scss +++ b/src/app/@theme/styles/pure/pure.theme.scss @@ -1,6 +1,67 @@ @import '~@nga/theme/styles/themes/nga.theme.default'; @import '../components'; -@import 'pure.redefines'; +@import 'pure.variables'; -@include nga-theme(); -@include custom-components-theme(); +@include nga-theme('pure') { + color: $nga-color-default; + + input { + color: $nga-color-default; + } + + a:hover { + color: $nga-color-secondary; + text-decoration: none; + } + + nga-layout-header > nav { + box-shadow: 0 4px 12px 0 rgba(33, 57, 161, 0.08); + } + + nga-sidebar { + z-index: 1; + box-shadow: 0 4px 12px 0 rgba(33, 57, 161, 0.08); + + ul li { + &:first-child { + margin-top: 3rem; + } + + a { + display: flex; + align-items: center; + + transition: all 0.2s ease; + padding: 0.375rem 0 0.375rem 1rem; + + &:hover { + background: $nga-color-primary; + color: $nga-color-default; + } + + &.active { + font-weight: bold; + color: $nga-color-default; + background: $nga-color-primary; + } + + i { + font-size: 2rem; + margin-right: 1.25rem; + + &:first-child { + display: flex; + justify-content: center; + } + } + } + } + } + + nga-layout-footer > nav { + box-shadow: 0 4px 12px 0 rgba(33, 57, 161, 0.08); + border: none !important; + padding: 1.25rem; + } + @include custom-components-theme(); +} diff --git a/src/app/@theme/theme.module.ts b/src/app/@theme/theme.module.ts index 83a5b7d0..0a4d61e5 100644 --- a/src/app/@theme/theme.module.ts +++ b/src/app/@theme/theme.module.ts @@ -9,7 +9,7 @@ import { NgaRouteTabsetModule, NgaSidebarModule, NgaMenuModule, - NgaUserModule + NgaUserModule, } from '@nga/theme'; import { SearchInputComponent } from './search-input/search-input.component'; @@ -19,7 +19,7 @@ import { BaseFooterComponent } from './layouts/base-footer/base-footer.component const BASE_MODULES = [ CommonModule, FormsModule, - ReactiveFormsModule + ReactiveFormsModule, ]; const NGA_MODULES = [ @@ -28,13 +28,13 @@ const NGA_MODULES = [ NgaTabsetModule, NgaRouteTabsetModule, NgaMenuModule, - NgaUserModule + NgaUserModule, ]; const LAYOUTS = [ OneCollLayoutComponent, BaseHeaderComponent, - BaseFooterComponent + BaseFooterComponent, ]; @NgModule({ @@ -47,13 +47,13 @@ const LAYOUTS = [ ...BASE_MODULES, ...NGA_MODULES, ...LAYOUTS, - SearchInputComponent + SearchInputComponent, ], declarations: [ ...LAYOUTS, SearchInputComponent, - BaseFooterComponent - ] + BaseFooterComponent, + ], }) export class ThemeModule { } diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 2c10f10e..21ea2d51 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -3,18 +3,18 @@ import { NgModule } from '@angular/core'; const routes: Routes = [ // {path: 'admin'} - {path: 'pages', loadChildren: 'app/pages/pages.module#PagesModule'}, - {path: '', redirectTo: 'pages', pathMatch: 'full'}, - {path: '**', redirectTo: 'pages'} + { path: 'pages', loadChildren: 'app/pages/pages.module#PagesModule' }, + { path: '', redirectTo: 'pages', pathMatch: 'full' }, + { path: '**', redirectTo: 'pages' }, ]; const config: ExtraOptions = { - useHash: true + useHash: true, }; @NgModule({ imports: [RouterModule.forRoot(routes, config)], - exports: [RouterModule] + exports: [RouterModule], }) export class AppRoutingModule { } diff --git a/src/app/app.component.scss b/src/app/app.component.scss index 970412c6..67e21d3b 100644 --- a/src/app/app.component.scss +++ b/src/app/app.component.scss @@ -1 +1 @@ -@import "@theme/styles/styles"; +@import '@theme/styles/styles'; diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 705de991..41cef4a3 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -7,10 +7,9 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { HttpModule } from '@angular/http'; -import { NgaThemeModule } from '@nga/theme'; +import { CoreModule } from './@core/core.module'; import { AppComponent } from './app.component'; -import { CoreModule } from './@core/core.module'; import { PagesModule } from './pages/pages.module'; import { AppRoutingModule } from './app-routing.module'; @@ -19,10 +18,9 @@ import { AppRoutingModule } from './app-routing.module'; imports: [ BrowserModule, HttpModule, - NgaThemeModule.forRoot(), AppRoutingModule, CoreModule, - PagesModule + PagesModule, ], bootstrap: [AppComponent], }) diff --git a/src/app/pages/components/components.component.html b/src/app/pages/components/components.component.html deleted file mode 100644 index 64f32e81..00000000 --- a/src/app/pages/components/components.component.html +++ /dev/null @@ -1,3 +0,0 @@ -

- components works! -

diff --git a/src/app/pages/components/components.component.scss b/src/app/pages/components/components.component.scss deleted file mode 100644 index e69de29b..00000000 diff --git a/src/app/pages/components/components.component.ts b/src/app/pages/components/components.component.ts index b5ec8d0e..83ec0b72 100644 --- a/src/app/pages/components/components.component.ts +++ b/src/app/pages/components/components.component.ts @@ -1,15 +1,12 @@ -import { Component, OnInit } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ - selector: 'app-components', - templateUrl: './components.component.html', - styleUrls: ['./components.component.scss'] + selector: 'components', + template: ` +

+ components works! +

+ `, }) -export class ComponentsComponent implements OnInit { - - constructor() { } - - ngOnInit() { - } - +export class ComponentsComponent { } diff --git a/src/app/pages/dashboard/dashboard.component.html b/src/app/pages/dashboard/dashboard.component.html deleted file mode 100644 index 107d75b1..00000000 --- a/src/app/pages/dashboard/dashboard.component.html +++ /dev/null @@ -1,3 +0,0 @@ -

- dashboard works! -

diff --git a/src/app/pages/dashboard/dashboard.component.scss b/src/app/pages/dashboard/dashboard.component.scss deleted file mode 100644 index e69de29b..00000000 diff --git a/src/app/pages/dashboard/dashboard.component.ts b/src/app/pages/dashboard/dashboard.component.ts index 8b7854bc..81e1bc1c 100644 --- a/src/app/pages/dashboard/dashboard.component.ts +++ b/src/app/pages/dashboard/dashboard.component.ts @@ -2,8 +2,11 @@ import { Component } from '@angular/core'; @Component({ selector: 'dashboard', - templateUrl: './dashboard.component.html', - styleUrls: ['./dashboard.component.scss'] + template: ` +

+ dashboard works! +

+ `, }) export class DashboardComponent { } diff --git a/src/app/pages/maps/maps.component.html b/src/app/pages/maps/maps.component.html deleted file mode 100644 index 56ed12c3..00000000 --- a/src/app/pages/maps/maps.component.html +++ /dev/null @@ -1,3 +0,0 @@ -

- maps works! -

diff --git a/src/app/pages/maps/maps.component.scss b/src/app/pages/maps/maps.component.scss deleted file mode 100644 index e69de29b..00000000 diff --git a/src/app/pages/maps/maps.component.ts b/src/app/pages/maps/maps.component.ts index 0145d418..edc18c7d 100644 --- a/src/app/pages/maps/maps.component.ts +++ b/src/app/pages/maps/maps.component.ts @@ -1,15 +1,12 @@ -import { Component, OnInit } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ - selector: 'app-maps', - templateUrl: './maps.component.html', - styleUrls: ['./maps.component.scss'] + selector: 'maps', + template: ` +

+ maps works! +

+ `, }) -export class MapsComponent implements OnInit { - - constructor() { } - - ngOnInit() { - } - +export class MapsComponent { } diff --git a/src/app/pages/pages-menu.ts b/src/app/pages/pages-menu.ts index 18163bc1..bed9f41f 100644 --- a/src/app/pages/pages-menu.ts +++ b/src/app/pages/pages-menu.ts @@ -7,21 +7,25 @@ export const menuItems: List = List([ title: 'Dashboard', icon: 'ion ion-ios-home-outline', link: '/pages/dashboard', - selected: true + home: true, + }, + { + title: 'Features', + group: true, }, { title: 'UI Features', icon: 'ion ion-ios-keypad-outline', - link: '/pages/ui-features' + link: '/pages/ui-features', }, { title: 'Components', icon: 'ion ion-ios-gear-outline', - link: '/pages/components' + link: '/pages/components', }, { title: 'Maps', icon: 'ion ion-ios-location-outline', - link: '/pages/maps' - } + link: '/pages/maps', + }, ]); diff --git a/src/app/pages/pages-routing.module.ts b/src/app/pages/pages-routing.module.ts index 542794e6..90da6031 100644 --- a/src/app/pages/pages-routing.module.ts +++ b/src/app/pages/pages-routing.module.ts @@ -12,18 +12,18 @@ const routes: Routes = [ path: '', component: PagesComponent, children: [ - {path: 'dashboard', component: DashboardComponent}, - {path: 'ui-features', component: UiFeaturesComponent}, - {path: 'components', component: ComponentsComponent}, - {path: 'maps', component: MapsComponent}, - {path: '', redirectTo: 'dashboard', pathMatch: 'full'} - ] - } + { path: 'dashboard', component: DashboardComponent }, + { path: 'ui-features', component: UiFeaturesComponent }, + { path: 'components', component: ComponentsComponent }, + { path: 'maps', component: MapsComponent }, + { path: '', redirectTo: 'dashboard', pathMatch: 'full' }, + ], + }, ]; @NgModule({ imports: [RouterModule.forChild(routes)], - exports: [RouterModule] + exports: [RouterModule], }) export class PagesRoutingModule { } diff --git a/src/app/pages/pages.component.ts b/src/app/pages/pages.component.ts index f136d65d..5f3c6453 100644 --- a/src/app/pages/pages.component.ts +++ b/src/app/pages/pages.component.ts @@ -7,7 +7,7 @@ import { Component } from '@angular/core'; - ` + `, }) export class PagesComponent { } diff --git a/src/app/pages/pages.module.ts b/src/app/pages/pages.module.ts index 4fd1908e..20232fc4 100644 --- a/src/app/pages/pages.module.ts +++ b/src/app/pages/pages.module.ts @@ -1,9 +1,6 @@ import { NgModule } from '@angular/core'; -import { - NgaSidebarModule, - NgaMenuModule -} from '@nga/theme'; +import { NgaMenuModule, NgaSidebarModule, NgaThemeModule } from '@nga/theme'; import { menuItems } from './pages-menu'; @@ -17,20 +14,19 @@ import { ComponentsComponent } from './components/components.component'; @NgModule({ imports: [ + NgaThemeModule.forRoot({ name: 'pure' }), NgaSidebarModule.forRoot(), - NgaMenuModule.forRoot({ - items: menuItems - }), + NgaMenuModule.forRoot({ items: menuItems }), PagesRoutingModule, - ThemeModule + ThemeModule, ], declarations: [ PagesComponent, DashboardComponent, UiFeaturesComponent, MapsComponent, - ComponentsComponent - ] + ComponentsComponent, + ], }) export class PagesModule { } diff --git a/src/app/pages/ui-features/ui-features.component.html b/src/app/pages/ui-features/ui-features.component.html deleted file mode 100644 index 5a375d2e..00000000 --- a/src/app/pages/ui-features/ui-features.component.html +++ /dev/null @@ -1,3 +0,0 @@ -

- ui-features works! -

diff --git a/src/app/pages/ui-features/ui-features.component.scss b/src/app/pages/ui-features/ui-features.component.scss deleted file mode 100644 index e69de29b..00000000 diff --git a/src/app/pages/ui-features/ui-features.component.ts b/src/app/pages/ui-features/ui-features.component.ts index 7b40b5d0..60856a5f 100644 --- a/src/app/pages/ui-features/ui-features.component.ts +++ b/src/app/pages/ui-features/ui-features.component.ts @@ -1,15 +1,12 @@ -import { Component, OnInit } from '@angular/core'; +import { Component } from '@angular/core'; @Component({ - selector: 'app-ui-features', - templateUrl: './ui-features.component.html', - styleUrls: ['./ui-features.component.scss'] + selector: 'ui-features', + template: ` +

+ ui-features works! +

+ `, }) -export class UiFeaturesComponent implements OnInit { - - constructor() { } - - ngOnInit() { - } - +export class UiFeaturesComponent { } diff --git a/tslint.json b/tslint.json index 080d0470..4487356f 100644 --- a/tslint.json +++ b/tslint.json @@ -96,8 +96,8 @@ ], "no-conditional-assignment": true, "no-console": [true, "log"], - "directive-selector": [true, "attribute", ["nga"], "camelCase"], - "component-selector": [true, "element", ["nga"], "kebab-case"], + "directive-selector": [true, "attribute", "camelCase"], + "component-selector": [true, "element", "kebab-case"], "use-input-property-decorator": true, "use-output-property-decorator": true, "use-host-property-decorator": true,