From 8e852caa4a8aa90d25ca087da512a8f8a98023cb Mon Sep 17 00:00:00 2001 From: Dmitry Nehaychik <4dmitr@gmail.com> Date: Sun, 3 Mar 2019 18:15:37 +0300 Subject: [PATCH] feat(playground): add without-styles folder for bootstrap like use-cases (#1271) --- .../playground-module/add-to-modules.ts | 4 +- schematics/utils/playground.ts | 2 +- src/app/playground-components.ts | 22 +-- src/playground/playground-routing.module.ts | 4 + .../bootstrap/bootstrap-test.component.ts | 146 -------------- .../without-layout-routing.module.ts | 4 - .../bootstrap/bootstrap-routing.module.ts | 0 .../bootstrap/bootstrap-test.component.html | 183 ++++++++++++++++++ .../bootstrap/bootstrap-test.component.ts | 35 ++++ .../bootstrap/bootstrap.module.ts | 0 .../without-styles/bootstrap/styles.scss | 10 + .../without-styles-routing.module.ts | 29 +++ .../without-styles.component.ts | 16 ++ .../without-styles/without-styles.module.ts | 17 ++ 14 files changed, 308 insertions(+), 164 deletions(-) delete mode 100644 src/playground/without-layout/bootstrap/bootstrap-test.component.ts rename src/playground/{without-layout => without-styles}/bootstrap/bootstrap-routing.module.ts (100%) create mode 100644 src/playground/without-styles/bootstrap/bootstrap-test.component.html create mode 100644 src/playground/without-styles/bootstrap/bootstrap-test.component.ts rename src/playground/{without-layout => without-styles}/bootstrap/bootstrap.module.ts (100%) create mode 100644 src/playground/without-styles/bootstrap/styles.scss create mode 100644 src/playground/without-styles/without-styles-routing.module.ts create mode 100644 src/playground/without-styles/without-styles.component.ts create mode 100644 src/playground/without-styles/without-styles.module.ts diff --git a/schematics/playground-module/add-to-modules.ts b/schematics/playground-module/add-to-modules.ts index 42fc15b507..aa6170f7da 100644 --- a/schematics/playground-module/add-to-modules.ts +++ b/schematics/playground-module/add-to-modules.ts @@ -29,7 +29,7 @@ import { applyReplaceChange, findRoutingModule, findFeatureModule, - getPlaygroundRootDir, + getPlaygroundDirs, findRoutesArray, addMissingChildRoutes, isInPlaygroundRoot, @@ -42,7 +42,7 @@ import { } from '../utils'; export function addToModules(tree: Tree, context: SchematicContext): Tree { - processDirs(tree, context, [getPlaygroundRootDir(tree)]); + processDirs(tree, context, getPlaygroundDirs(tree)); return tree; } diff --git a/schematics/utils/playground.ts b/schematics/utils/playground.ts index 6f2be65ab3..5d090f6e24 100644 --- a/schematics/utils/playground.ts +++ b/schematics/utils/playground.ts @@ -44,7 +44,7 @@ export function getPlaygroundRootDir(tree: Tree): DirEntry { * Returns DirEntries of root playground directories excluding ignored. * @param tree */ -function getPlaygroundDirs(tree: Tree): DirEntry[] { +export function getPlaygroundDirs(tree: Tree): DirEntry[] { const pgDir = getPlaygroundRootDir(tree); return pgDir.subdirs diff --git a/src/app/playground-components.ts b/src/app/playground-components.ts index 041db09010..161bdc87f3 100644 --- a/src/app/playground-components.ts +++ b/src/app/playground-components.ts @@ -1309,17 +1309,6 @@ export const PLAYGROUND_COMPONENTS: ComponentLink[] = [ }, ], }, - { - path: 'bootstrap', - children: [ - { - path: 'bootstrap-test.component', - link: '/bootstrap/bootstrap-test.component', - component: 'BootstrapTestComponent', - name: 'Bootstrap Test', - }, - ], - }, { path: 'context-menu', children: [ @@ -1630,4 +1619,15 @@ export const PLAYGROUND_COMPONENTS: ComponentLink[] = [ }, ], }, + { + path: 'bootstrap', + children: [ + { + path: 'bootstrap-test.component', + link: '/bootstrap/bootstrap-test.component', + component: 'BootstrapTestComponent', + name: 'Bootstrap Test', + }, + ], + }, ]; diff --git a/src/playground/playground-routing.module.ts b/src/playground/playground-routing.module.ts index 20fe050e05..8562f02c27 100644 --- a/src/playground/playground-routing.module.ts +++ b/src/playground/playground-routing.module.ts @@ -16,6 +16,10 @@ export const routes: Routes = [ path: '', loadChildren: './without-layout/without-layout.module#WithoutLayoutModule', }, + { + path: '', + loadChildren: './without-styles/without-styles.module#WithoutStylesModule', + }, ]; @NgModule({ diff --git a/src/playground/without-layout/bootstrap/bootstrap-test.component.ts b/src/playground/without-layout/bootstrap/bootstrap-test.component.ts deleted file mode 100644 index ced4edbeea..0000000000 --- a/src/playground/without-layout/bootstrap/bootstrap-test.component.ts +++ /dev/null @@ -1,146 +0,0 @@ -/** - * @license - * Copyright Akveo. All Rights Reserved. - * Licensed under the MIT License. See License.txt in the project root for license information. - */ - -import { Component } from '@angular/core'; - -@Component({ - selector: 'nb-bootstrap-test', - styles: [ - ``, - ], - template: ` - - -

Buttons

-
- - - - - - -
-
- - - - -
-

Tables

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
idnameemail
someJohn Doetest@test.com
someJohn Doetest@test.com
someJohn Doetest@test.com
someJohn Doetest@test.com
-

Checkbox & Radio

-
-
-
- - -
-
- - -
-
-
-
- - -
-
- - -
-
- - -
-
-
-
- - -
-
- - -
-
-
-
- - -
-
- - -
-
-
-

Forms

- - - - - - - - - - -
- - - -
- - - - - -
- - - -
- - - - - `, -}) -export class BootstrapTestComponent { -} diff --git a/src/playground/without-layout/without-layout-routing.module.ts b/src/playground/without-layout/without-layout-routing.module.ts index 005353154a..e0bdaa3809 100644 --- a/src/playground/without-layout/without-layout-routing.module.ts +++ b/src/playground/without-layout/without-layout-routing.module.ts @@ -13,10 +13,6 @@ const routes: Route[] = [ path: '', component: PlaygroundBaseComponent, children: [ - { - path: 'bootstrap', - loadChildren: './bootstrap/bootstrap.module#BootstrapModule', - }, { path: 'context-menu', loadChildren: './context-menu/context-menu.module#ContextMenuModule', diff --git a/src/playground/without-layout/bootstrap/bootstrap-routing.module.ts b/src/playground/without-styles/bootstrap/bootstrap-routing.module.ts similarity index 100% rename from src/playground/without-layout/bootstrap/bootstrap-routing.module.ts rename to src/playground/without-styles/bootstrap/bootstrap-routing.module.ts diff --git a/src/playground/without-styles/bootstrap/bootstrap-test.component.html b/src/playground/without-styles/bootstrap/bootstrap-test.component.html new file mode 100644 index 0000000000..c092f90b92 --- /dev/null +++ b/src/playground/without-styles/bootstrap/bootstrap-test.component.html @@ -0,0 +1,183 @@ + + +
+ +
+ + Buttons + + + + + + + + +
+ +
+ + Hero Buttons + + + + + + + + +
+ +
+ + Default Inputs + +
+ +
+
+
+ +
+
+ +
+
+
+ +
+
+ +
+
+ +
+
+ + A block of help text that breaks into a new line and may extend beyond one line. + +
+
+ +
+
+ +
+
+ +
+
+ +
+ + + + + Selects + +
+ + +
+
+ + +
+ + +
+ +
+ + Input Styles + +
+ +
+
+ +
+
+ +
+ + + + + Validation States + +
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+ + + + + Checkboxes & Radios + +
+
+
+ + +
+
+
+ + + +
+
+ +
+
+ + +
+
+ + + diff --git a/src/playground/without-styles/bootstrap/bootstrap-test.component.ts b/src/playground/without-styles/bootstrap/bootstrap-test.component.ts new file mode 100644 index 0000000000..96fc669918 --- /dev/null +++ b/src/playground/without-styles/bootstrap/bootstrap-test.component.ts @@ -0,0 +1,35 @@ +/** + * @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'; + +import 'style-loader!./styles.scss'; + +@Component({ + selector: 'nb-bootstrap-test', + styles: [ + ` + button { + margin-right: 1rem; + } + + .input-group { + margin-bottom: 1rem; + } + `, + ], + templateUrl: './bootstrap-test.component.html', +}) +export class BootstrapTestComponent implements OnInit { + + constructor(private themeService: NbThemeService) { + } + + ngOnInit() { + this.themeService.changeTheme('default'); + } +} diff --git a/src/playground/without-layout/bootstrap/bootstrap.module.ts b/src/playground/without-styles/bootstrap/bootstrap.module.ts similarity index 100% rename from src/playground/without-layout/bootstrap/bootstrap.module.ts rename to src/playground/without-styles/bootstrap/bootstrap.module.ts diff --git a/src/playground/without-styles/bootstrap/styles.scss b/src/playground/without-styles/bootstrap/styles.scss new file mode 100644 index 0000000000..d09c891488 --- /dev/null +++ b/src/playground/without-styles/bootstrap/styles.scss @@ -0,0 +1,10 @@ +@import '~bootstrap/scss/bootstrap'; + +@import '../../../framework/theme/styles/theming'; +@import '../../../framework/theme/styles/themes'; +@import '../../../framework/theme/styles/globals'; +@import '../../../framework/bootstrap/styles/globals'; + +@include nb-install() { + @include nb-bootstrap-global(); +} diff --git a/src/playground/without-styles/without-styles-routing.module.ts b/src/playground/without-styles/without-styles-routing.module.ts new file mode 100644 index 0000000000..3d14bc3556 --- /dev/null +++ b/src/playground/without-styles/without-styles-routing.module.ts @@ -0,0 +1,29 @@ +/** + * @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, Route} from '@angular/router'; + +import { WithoutStylesComponent } from './without-styles.component'; + +const routes: Route[] = [ + { + path: '', + component: WithoutStylesComponent, + children: [ + { + path: 'bootstrap', + loadChildren: './bootstrap/bootstrap.module#BootstrapModule', + }, + ], + }, +]; + +@NgModule({ + imports: [ RouterModule.forChild(routes) ], + exports: [ RouterModule ], +}) +export class WithoutStylesRoutingModule {} diff --git a/src/playground/without-styles/without-styles.component.ts b/src/playground/without-styles/without-styles.component.ts new file mode 100644 index 0000000000..66d3fff9e1 --- /dev/null +++ b/src/playground/without-styles/without-styles.component.ts @@ -0,0 +1,16 @@ +/** + * @license + * Copyright Akveo. All Rights Reserved. + * Licensed under the MIT License. See License.txt in the project root for license information. + */ + +import { Component } from '@angular/core'; + +@Component({ + selector: 'nb-custom', + template: ` + + `, +}) +export class WithoutStylesComponent { +} diff --git a/src/playground/without-styles/without-styles.module.ts b/src/playground/without-styles/without-styles.module.ts new file mode 100644 index 0000000000..f2fd53b605 --- /dev/null +++ b/src/playground/without-styles/without-styles.module.ts @@ -0,0 +1,17 @@ +/** + * @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 { WithoutStylesRoutingModule } from './without-styles-routing.module'; +import { WithoutStylesComponent } from './without-styles.component'; + +@NgModule({ + declarations: [ + WithoutStylesComponent, + ], + imports: [ WithoutStylesRoutingModule ], +}) +export class WithoutStylesModule {}