diff --git a/docs/app/app.module.ts b/docs/app/app.module.ts index 96eed0b848..0435e7eaea 100644 --- a/docs/app/app.module.ts +++ b/docs/app/app.module.ts @@ -55,7 +55,7 @@ import { BlockHelperService } from './docs/utils/block-helper.service'; NbLayoutModule, NbTabsetModule, NbMenuModule.forRoot(), - NbThemeModule.forRoot({ name: 'default' }), + NbThemeModule.forRoot({ name: 'docs' }), NbSidebarModule.forRoot(), RouterModule.forRoot(routes, { useHash: true }), ], diff --git a/docs/app/app.routes.ts b/docs/app/app.routes.ts index a5d3b7e67a..58093cd310 100644 --- a/docs/app/app.routes.ts +++ b/docs/app/app.routes.ts @@ -31,6 +31,10 @@ export const routes: Routes = [ component: NgdPageComponent, }], }, + { + path: 'example', + loadChildren: '../../src/playground/playground.module#NbPlaygroundModule', + }, { path: '**', redirectTo: 'home', diff --git a/docs/app/styles/_themes.scss b/docs/app/styles/_themes.scss index d5d87dcf4d..659e95a001 100644 --- a/docs/app/styles/_themes.scss +++ b/docs/app/styles/_themes.scss @@ -4,7 +4,19 @@ @import '../../../src/framework/theme/styles/themes'; // which themes you what to enable (empty to enable all - not recommended) -$nb-enabled-themes: (default); +$nb-enabled-themes: (docs, default); + +// TODO remove +$nb-themes: nb-register-theme(( + landing-font: Exo, + landing-golden: #ffd22d, + landing-red: #fc3b41, + landing-fg: #b7b7fe, + landing-fg-light: #e0e0ff, + landing-highlight: #42db7d, + landing-primary: #8a7fff, + landing-bg: #13113b, +), default, default); $nb-themes: nb-register-theme(( font-main: Roboto, @@ -113,5 +125,5 @@ $nb-themes: nb-register-theme(( tabs-font-size: 1.25rem, tabs-active-font-weight: font-weight-normal -), default, default); +), docs, default); diff --git a/docs/tsconfig.app.json b/docs/tsconfig.app.json index 3849386dfa..91c5feb702 100644 --- a/docs/tsconfig.app.json +++ b/docs/tsconfig.app.json @@ -23,5 +23,9 @@ "exclude": [ "test.ts", "**/*.spec.ts" + ], + "include": [ + "../docs/**/*", + "../src/playground/playground.module.ts" ] } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index dd02790378..7f460e0fbf 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -66,10 +66,9 @@ import { NbMenuTestComponent, } from './menu-test/menu-test.component'; import { NbUserTestComponent } from './user-test/user-test.component'; -import { NbDynamicToAddComponent, NbThemeDynamicTestComponent } from './layout-test/theme-dynamic-test.component'; +import { NbThemeDynamicTestComponent } from './layout-test/theme-dynamic-test.component'; import { NbActionsTestComponent } from './actions-test/actions-test.component'; import { NbBootstrapTestComponent } from './bootstrap-test/bootstrap-test.component'; -import { NbPopoverTestComponent } from './popover-test/popover-test.component'; import { NbContextMenuTestComponent } from './context-menu-test/context-menu-test.component'; import { routes } from './app.routes'; @@ -83,6 +82,8 @@ import { NbCardTestComponent } from './card-test/card-test.component'; import { NbAclTestComponent } from './acl-test/acl-test.component'; import { AuthGuard } from './auth-guard.service'; import { RoleProvider } from './role.provider'; +import { NbDynamicToAddComponent } from './dynamic.component'; +import { NbPlaygroundModule } from '../playground/playground.module'; const NB_TEST_COMPONENTS = [ NbAppComponent, @@ -113,12 +114,10 @@ const NB_TEST_COMPONENTS = [ NbSearchTestComponent, NbSearchTestCustomizedComponent, NbBootstrapTestComponent, - NbDynamicToAddComponent, NbThemeDynamicTestComponent, NbThemeBreakpointTestComponent, NbActionsTestComponent, NbFormsTestComponent, - NbPopoverTestComponent, NbCheckboxTestComponent, NbAclTestComponent, NbContextMenuTestComponent, @@ -143,6 +142,7 @@ const NB_TEST_COMPONENTS = [ NbPopoverModule, NbContextMenuModule, NbCheckboxModule, + NbPlaygroundModule, NbAuthModule.forRoot({ forms: { login: { diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts index a4bdeb23e5..277fd62039 100644 --- a/src/app/app.routes.ts +++ b/src/app/app.routes.ts @@ -41,7 +41,6 @@ import { NbSidebarTestComponent } from './sidebar-test/sidebar-test.component'; import { NbTabsetTestComponent } from './tabset-test/tabset-test.component'; import { NbUserTestComponent } from './user-test/user-test.component'; import { NbCardTestComponent } from './card-test/card-test.component'; -import { NbPopoverTestComponent } from './popover-test/popover-test.component'; import { NbAuthComponent, NbLoginComponent, @@ -54,8 +53,10 @@ import { AuthGuard } from './auth-guard.service'; import { NbCheckboxTestComponent } from './checkbox-test/checkbox-test.component'; import { NbAclTestComponent } from './acl-test/acl-test.component'; import { NbContextMenuTestComponent } from './context-menu-test/context-menu-test.component'; +import { routes as playgroundRoutes } from '../playground/playground-routing.module'; export const routes: Routes = [ + ...playgroundRoutes, { path: '', component: NbCardTestComponent, @@ -251,10 +252,6 @@ export const routes: Routes = [ path: 'forms', component: NbFormsTestComponent, }, - { - path: 'popover', - component: NbPopoverTestComponent, - }, { path: 'acl', component: NbAclTestComponent, diff --git a/src/app/dynamic.component.ts b/src/app/dynamic.component.ts new file mode 100644 index 0000000000..4fea61b443 --- /dev/null +++ b/src/app/dynamic.component.ts @@ -0,0 +1,15 @@ +import { Component, Input } from '@angular/core'; + +@Component({ + selector: 'nb-dynamic-to-add', + template: ` +
+ hello from dynamically inserted component: {{text}} +
+ `, +}) +export class NbDynamicToAddComponent { + + @Input() + text: string = ''; +} diff --git a/src/app/layout-test/theme-dynamic-test.component.ts b/src/app/layout-test/theme-dynamic-test.component.ts index 2c8a17dc49..11119dab83 100644 --- a/src/app/layout-test/theme-dynamic-test.component.ts +++ b/src/app/layout-test/theme-dynamic-test.component.ts @@ -4,23 +4,10 @@ * Licensed under the MIT License. See License.txt in the project root for license information. */ -import { Component, Input, ComponentFactoryResolver } from '@angular/core'; +import { Component, ComponentFactoryResolver } from '@angular/core'; import { NbThemeService } from '@nebular/theme'; - -@Component({ - selector: 'nb-dynamic-to-add', - template: ` -
- hello from dynamically inserted component: {{text}} -
- `, -}) -export class NbDynamicToAddComponent { - - @Input() - text: string = ''; -} +import { NbDynamicToAddComponent } from '../dynamic.component'; @Component({ selector: 'nb-dynamic-test', @@ -34,7 +21,7 @@ export class NbDynamicToAddComponent { - Sidebar content + Sidebar content @@ -51,10 +38,11 @@ export class NbDynamicToAddComponent { © Akveo 2017 -`, + `, }) export class NbThemeDynamicTestComponent { - constructor(private themeService: NbThemeService, private componentFactoryResolver: ComponentFactoryResolver) {} + constructor(private themeService: NbThemeService, private componentFactoryResolver: ComponentFactoryResolver) { + } addDynamicComponent() { this.themeService.appendToLayoutTop(NbDynamicToAddComponent).subscribe(cRef => console.info(cRef)); diff --git a/src/playground/examples/index.ts b/src/playground/examples/index.ts new file mode 100644 index 0000000000..177fdc06df --- /dev/null +++ b/src/playground/examples/index.ts @@ -0,0 +1 @@ +export * from './popover-example.component'; diff --git a/src/app/popover-test/popover-test.component.ts b/src/playground/examples/popover-example.component.ts similarity index 97% rename from src/app/popover-test/popover-test.component.ts rename to src/playground/examples/popover-example.component.ts index 19a9a88273..37676910cd 100644 --- a/src/app/popover-test/popover-test.component.ts +++ b/src/playground/examples/popover-example.component.ts @@ -5,15 +5,14 @@ */ import { ChangeDetectionStrategy, Component } from '@angular/core'; -import { NbDynamicToAddComponent } from '../layout-test/theme-dynamic-test.component'; +import { NbDynamicToAddComponent } from '../../app/dynamic.component'; @Component({ - selector: 'nb-popover-test', + selector: 'nb-popover-example', changeDetection: ChangeDetectionStrategy.OnPush, template: ` - Content Type @@ -146,11 +145,12 @@ import { NbDynamicToAddComponent } from '../layout-test/theme-dynamic-test.compo + `, }) -export class NbPopoverTestComponent { +export class NbPopoverExampleComponent { customPopoverComponent = NbDynamicToAddComponent; diff --git a/src/playground/playground-routing.module.ts b/src/playground/playground-routing.module.ts new file mode 100644 index 0000000000..6c14203902 --- /dev/null +++ b/src/playground/playground-routing.module.ts @@ -0,0 +1,28 @@ +/** + * @license + * Copyright Akveo. All Rights Reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + */ + +import { NgModule } from '@angular/core'; +import { RouterModule, Routes } from '@angular/router'; +import { NbPopoverExampleComponent } from './examples'; +import { NbPlaygroundComponent } from './playground.component'; + + +export const routes: Routes = [ + { + path: '', + component: NbPlaygroundComponent, + children: [ + { path: 'popover', component: NbPopoverExampleComponent }, + ], + }, +]; + +@NgModule({ + imports: [RouterModule.forChild(routes)], + exports: [RouterModule], +}) +export class NbPlaygroundRoutingModule { +} diff --git a/src/playground/playground.component.ts b/src/playground/playground.component.ts new file mode 100644 index 0000000000..cd00029e8d --- /dev/null +++ b/src/playground/playground.component.ts @@ -0,0 +1,22 @@ +/** + * @license + * Copyright Akveo. All Rights Reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + */ + +import { Component, OnInit } from '@angular/core'; +import { NbThemeService } from '@nebular/theme'; + +@Component({ + selector: 'nb-playground', + template: '', +}) + +export class NbPlaygroundComponent implements OnInit { + constructor(private themeService: NbThemeService) { + } + + ngOnInit() { + this.themeService.changeTheme('default'); + } +} diff --git a/src/playground/playground.module.ts b/src/playground/playground.module.ts new file mode 100644 index 0000000000..b99e5c7b35 --- /dev/null +++ b/src/playground/playground.module.ts @@ -0,0 +1,50 @@ +/** + * @license + * Copyright Akveo. All Rights Reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + */ + +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { NbCardModule, NbLayoutModule, NbPopoverModule } from '@nebular/theme'; + +import { NbPlaygroundRoutingModule } from './playground-routing.module'; +import { NbPlaygroundComponent } from './playground.component'; +import { NbPopoverExampleComponent } from './examples'; +import { NbDynamicToAddComponent } from '../app/dynamic.component'; + +export const NB_MODULES = [ + NbCardModule, + NbLayoutModule, + NbPopoverModule, +]; + +export const NB_EXAMPLE_COMPONENTS = [ + NbPopoverExampleComponent, +]; + +export const NB_ENTRY_COMPONENTS = [ + NbDynamicToAddComponent, +]; + +@NgModule({ + imports: [ + CommonModule, + NbPlaygroundRoutingModule, + ...NB_MODULES, + ], + exports: [ + ...NB_ENTRY_COMPONENTS, + ...NB_EXAMPLE_COMPONENTS, + ], + declarations: [ + NbPlaygroundComponent, + ...NB_ENTRY_COMPONENTS, + ...NB_EXAMPLE_COMPONENTS, + ], + entryComponents: [ + ...NB_ENTRY_COMPONENTS, + ], +}) +export class NbPlaygroundModule { +}