Skip to content

Commit dd1cdfc

Browse files
Deepika516Deepika516
committed
feat(arc-lib): standalone components with intro part
standalone components with docs of introduction part GH-26
1 parent a276f18 commit dd1cdfc

31 files changed

+1304
-199
lines changed

‎angular.json

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -196,7 +196,12 @@
196196
"inlineStyleLanguage": "scss",
197197
"assets": [
198198
"projects/arc-docs/src/favicon.ico",
199-
"projects/arc-docs/src/assets"
199+
{ "glob": "**/*", "input": "node_modules/monaco-editor", "output": "/assets/monaco/" },
200+
{
201+
"glob": "**/*",
202+
"input": "projects/arc-lib/src/lib/assets/",
203+
"output": "/assets/"
204+
}
200205
],
201206
"styles": [
202207
"./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",

‎projects/arc-docs/src/app/app.module.ts

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,18 @@ import {BrowserModule} from '@angular/platform-browser';
44
import {AppRoutingModule} from './app-routing.module';
55
import {AppComponent} from './app.component';
66
import {ThemeModule} from '@project-lib/theme/theme.module';
7+
import {HeaderComponent} from '@project-lib/components/header /header.component';
8+
import {SidebarComponent} from '@project-lib/components/sidebar/sidebar.component';
79

810
@NgModule({
911
declarations: [AppComponent],
10-
imports: [BrowserModule, AppRoutingModule, ThemeModule.forRoot('default')],
12+
imports: [
13+
BrowserModule,
14+
AppRoutingModule,
15+
ThemeModule.forRoot('default'),
16+
HeaderComponent,
17+
SidebarComponent,
18+
],
1119
providers: [],
1220
bootstrap: [AppComponent],
1321
})

‎projects/arc-docs/src/app/docs/docs.component.html

Lines changed: 13 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,17 @@
1-
<!-- <nb-layout>
2-
<nb-layout-header fixed style="background-color: antiquewhite">
3-
<a href="#"><i class="nb-menu"></i></a
4-
></nb-layout-header>
51

6-
<nb-sidebar></nb-sidebar>
2+
<nb-layout>
3+
<nb-layout-header fixed class="border-basic-bottom">
4+
<div class="header-wrapper">
5+
<lib-header></lib-header>
6+
</div>
7+
</nb-layout-header>
8+
9+
<nb-sidebar>
10+
<nb-menu [items]="menu"> </nb-menu>
11+
<lib-sidebar></lib-sidebar>
12+
</nb-sidebar>
713

8-
<nb-layout-column class="colored-column-basic"
9-
>Layout Content
10-
<router-outlet></router-outlet>
14+
<nb-layout-column>
15+
<router-outlet class="main-router"></router-outlet>
1116
</nb-layout-column>
12-
</nb-layout> -->
13-
<nb-layout>
14-
<nb-layout-header>Awesome Company</nb-layout-header>
15-
<nb-layout-column class="colored-column-warning"
16-
>Left column</nb-layout-column
17-
>
18-
<nb-layout-column class="colored-column-danger"
19-
>Right column</nb-layout-column
20-
>
2117
</nb-layout>

‎projects/arc-docs/src/app/docs/docs.component.scss

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,71 @@
1+
@use 'sass:map';
2+
@use '../../../../arc-lib/src/lib/theme/styles/variables' as *;
3+
@use '@nebular/theme/styles/theming' as *;
4+
@use '../../styles.scss' as *;
5+
16
.colored-column-warning {
27
background-color: aqua;
38
}
9+
10+
@include nb-install-component() {
11+
.nav-container {
12+
display: flex;
13+
justify-content: space-between;
14+
width: 100%;
15+
}
16+
17+
.logo-container {
18+
display: flex;
19+
align-items: center;
20+
width: calc(#{nb-theme(sidebar-width)} - #{nb-theme(header-padding)});
21+
user-select: none;
22+
}
23+
24+
nb-action {
25+
height: auto;
26+
display: flex;
27+
align-content: center;
28+
}
29+
30+
nb-user {
31+
cursor: pointer;
32+
}
33+
34+
nb-sidebar {
35+
z-index: 1038;
36+
border-right: 0.063rem solid map.get($color, 'border-basic');
37+
border-top: 0.063rem solid map.get($color, 'border-basic');
38+
39+
nb-sidebar-footer {
40+
border-top: 0.063rem solid map.get($color, 'border-basic');
41+
}
42+
43+
nb-menu {
44+
margin: 0 !important;
45+
}
46+
}
47+
48+
.header-container {
49+
display: flex;
50+
align-items: center;
51+
width: auto;
52+
53+
.menu-icon {
54+
margin-left: 0.625rem;
55+
}
56+
57+
.logo {
58+
padding: 0 1.25rem;
59+
padding-left: 0.625rem;
60+
font-size: 1.75rem;
61+
white-space: nowrap;
62+
text-decoration: none;
63+
}
64+
}
65+
}
66+
.hi {
67+
text-align: center;
68+
}
69+
.header-wrapper {
70+
width: 100%;
71+
}

‎projects/arc-docs/src/app/docs/docs.component.ts

Lines changed: 61 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,67 @@
1-
import {Component} from '@angular/core';
1+
import {Component, OnInit} from '@angular/core';
2+
import {ActivatedRoute, Router} from '@angular/router';
3+
import {NbMenuItem, NbMenuService, NbSidebarService} from '@nebular/theme';
4+
import {AuthService} from '@project-lib/core/auth';
5+
import {RouteComponentBaseDirective} from '@project-lib/core/route-component-base';
6+
import {IconPacksManagerService} from '@project-lib/theme/services';
7+
import {takeUntil} from 'rxjs';
8+
import {Location} from '@angular/common';
29

310
@Component({
411
selector: 'app-docs',
512
templateUrl: './docs.component.html',
613
styleUrls: ['./docs.component.scss'],
714
})
8-
export class DocsComponent {}
15+
export class DocsComponent
16+
extends RouteComponentBaseDirective
17+
implements OnInit
18+
{
19+
constructor(
20+
override readonly route: ActivatedRoute,
21+
override readonly location: Location,
22+
private readonly sidebarService: NbSidebarService,
23+
private readonly authService: AuthService,
24+
private readonly menuService: NbMenuService,
25+
private readonly iconMgr: IconPacksManagerService,
26+
private router: Router,
27+
) {
28+
super(route, location);
29+
this.iconMgr.registerSvgs();
30+
}
31+
32+
menu: NbMenuItem[] = [
33+
{
34+
title: 'Getting Started',
35+
icon: 'book-outline',
36+
// pathMatch: 'prefix',
37+
children: [
38+
{
39+
title: 'Introduction',
40+
link: '/docs/getting-started',
41+
},
42+
],
43+
},
44+
{
45+
title: 'Guide',
46+
icon: 'book-outline',
47+
children: [
48+
{
49+
title: 'Cloning Boilerplate',
50+
link: '/docs/guide/clone',
51+
},
52+
{
53+
title: 'Backend Integration',
54+
},
55+
],
56+
},
57+
];
58+
59+
ngOnInit(): void {
60+
this.menuService
61+
.onItemClick()
62+
.pipe(takeUntil(this._destroy$))
63+
.subscribe(menu => {
64+
console.log(menu);
65+
});
66+
}
67+
}

‎projects/arc-docs/src/app/docs/docs.module.ts

Lines changed: 53 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,61 @@ import {CommonModule} from '@angular/common';
33
import {DocsComponent} from './docs.component';
44
import {DocsRoutingModule} from './docs-routing.module';
55
import {ThemeModule} from '@project-lib/theme/theme.module';
6+
import {HeaderComponent} from '@project-lib/components/header /header.component';
7+
import {SidebarComponent} from '@project-lib/components/sidebar/sidebar.component';
8+
import {
9+
AuthService,
10+
CoreAuthModule,
11+
LoggedInUserAdapterService,
12+
LoginAdapterService,
13+
} from '@project-lib/core/auth';
14+
import {
15+
APPLICATION_STORE,
16+
APP_SESSION_STORE,
17+
AnyAdapter,
18+
ApiService,
19+
UserSessionStoreService,
20+
} from '@project-lib/core/index';
21+
import {
22+
InMemoryStorageService,
23+
LOCAL_STORAGE,
24+
SESSION_STORAGE,
25+
} from 'ngx-webstorage-service';
26+
import {HttpClientModule} from '@angular/common/http';
27+
import {SignUpAdapter} from '@project-lib/core/auth/adapters/signup-adapter.service';
28+
import {NgxPermissionsService, NgxPermissionsStore} from 'ngx-permissions';
29+
import {AuthModule} from '@project-lib/components/index';
30+
import {environment} from '@main-project/boiler/env/environment';
31+
import {APP_CONFIG} from '@project-lib/app-config';
632

733
@NgModule({
834
declarations: [DocsComponent],
9-
imports: [CommonModule, DocsRoutingModule, ThemeModule],
35+
imports: [
36+
CommonModule,
37+
38+
DocsRoutingModule,
39+
ThemeModule,
40+
HttpClientModule,
41+
HeaderComponent,
42+
SidebarComponent,
43+
CoreAuthModule,
44+
],
45+
providers: [
46+
// AuthService,
47+
// UserSessionStoreService,
48+
// {provide: APPLICATION_STORE, useExisting: LOCAL_STORAGE},
49+
// {provide: APP_SESSION_STORE, useExisting: SESSION_STORAGE},
50+
// InMemoryStorageService,
51+
// ApiService,
52+
// SignUpAdapter,
53+
// LoggedInUserAdapterService,
54+
// LoginAdapterService,
55+
// AnyAdapter,
56+
NgxPermissionsStore,
57+
{
58+
provide: APP_CONFIG,
59+
useValue: environment,
60+
},
61+
],
1062
})
1163
export class DocsModule {}

0 commit comments

Comments
 (0)