From 6396ce9b98a91569f7b73c8a58c61bc3edcc1dce Mon Sep 17 00:00:00 2001 From: Deepika Mahindroo Date: Mon, 1 Apr 2024 13:30:35 +0530 Subject: [PATCH 1/2] feat(arc-lib): standalone components with intro part standalone components with docs of introduction part GH-26 --- .../components/header /header.component.html | 18 +++++++++++ .../components/header /header.component.scss | 31 +++++++++++++++++++ .../lib/components/header/header.component.ts | 11 +------ 3 files changed, 50 insertions(+), 10 deletions(-) create mode 100644 projects/arc-lib/src/lib/components/header /header.component.html create mode 100644 projects/arc-lib/src/lib/components/header /header.component.scss diff --git a/projects/arc-lib/src/lib/components/header /header.component.html b/projects/arc-lib/src/lib/components/header /header.component.html new file mode 100644 index 0000000..98f02ed --- /dev/null +++ b/projects/arc-lib/src/lib/components/header /header.component.html @@ -0,0 +1,18 @@ +
+
+
+ + +
+
+
diff --git a/projects/arc-lib/src/lib/components/header /header.component.scss b/projects/arc-lib/src/lib/components/header /header.component.scss new file mode 100644 index 0000000..23ac918 --- /dev/null +++ b/projects/arc-lib/src/lib/components/header /header.component.scss @@ -0,0 +1,31 @@ +@use 'sass:map'; +@use '../../theme/styles/variables' as *; +@use '../.././../../../arc/src/styles.scss' as *; +@use '../../theme/styles/mixins' as *; + +.nav-container { + display: flex; + justify-content: space-between; + width: 100% !important; +} + +.logo-container { + display: flex; + align-items: center; + width: calc(#{nb-theme(sidebar-width)} - #{nb-theme(header-padding)}); + user-select: none; +} + +nb-action { + height: auto; + display: flex; + align-content: center; +} + +nb-user { + cursor: pointer; +} + +.hi { + text-align: center; +} diff --git a/projects/arc-lib/src/lib/components/header/header.component.ts b/projects/arc-lib/src/lib/components/header/header.component.ts index 0a7c07c..a2cf1ad 100644 --- a/projects/arc-lib/src/lib/components/header/header.component.ts +++ b/projects/arc-lib/src/lib/components/header/header.component.ts @@ -19,7 +19,7 @@ import {Location} from '@angular/common'; export class HeaderComponent extends RouteComponentBaseDirective { toggleFooter = false; loggedInUserDM: LoggedInUserDM = new LoggedInUserDM(); - userMenu: NbMenuItem[] = [{title: 'Log out', data: 'logout'}]; + constructor( override readonly route: ActivatedRoute, override readonly location: Location, @@ -41,13 +41,4 @@ export class HeaderComponent extends RouteComponentBaseDirective { this.sidebarService.toggle(true, 'right'); this.toggleFooter = !this.toggleFooter; } - - ngOnInit(): void { - this.authService - .currentUser() - .pipe(takeUntil(this._destroy$)) - .subscribe(usr => { - this.loggedInUserDM = usr; - }); - } } From 5ab28558090202de1338f50ef656d95e8515d9ef Mon Sep 17 00:00:00 2001 From: Deepika Mahindroo Date: Mon, 3 Jun 2024 16:41:32 +0530 Subject: [PATCH 2/2] docs(arc): documentation of cloning part documentation of cloning part of boilerplate GH-26 --- .../src/app/docs/docs-routing.module.ts | 5 ++ .../arc-docs/src/app/docs/docs.component.html | 1 - .../backend-integration-doc.component.html | 1 + .../backend-integration-doc.component.scss | 0 .../backend-integration-doc.component.spec.ts | 22 ++++++++ .../backend-integration-doc.component.ts | 8 +++ .../clone-boilerplate-doc.component.scss | 51 +++++++++++++++++++ .../clone-boilerplate-doc.component.spec.ts | 22 ++++++++ .../clone-boilerplate-doc.component.ts | 26 ++++++++++ .../app/docs/guide/guide-routing.module.ts | 22 ++++++++ .../src/app/docs/guide/guide.module.ts | 14 +++++ .../cli-wrapper/cli-wrapper.component.html | 13 +++++ .../cli-wrapper/cli-wrapper.component.scss | 36 +++++++++++++ .../cli-wrapper/cli-wrapper.component.ts | 13 +++++ .../arc/src/app/main/home/home.component.scss | 2 +- projects/arc/src/styles.scss | 37 +++++++------- 16 files changed, 251 insertions(+), 22 deletions(-) create mode 100644 projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.html create mode 100644 projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.scss create mode 100644 projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.spec.ts create mode 100644 projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.ts create mode 100644 projects/arc-docs/src/app/docs/guide/components/clone-boilerplate-doc/clone-boilerplate-doc.component.scss create mode 100644 projects/arc-docs/src/app/docs/guide/components/clone-boilerplate-doc/clone-boilerplate-doc.component.spec.ts create mode 100644 projects/arc-docs/src/app/docs/guide/components/clone-boilerplate-doc/clone-boilerplate-doc.component.ts create mode 100644 projects/arc-docs/src/app/docs/guide/guide-routing.module.ts create mode 100644 projects/arc-docs/src/app/docs/guide/guide.module.ts create mode 100644 projects/arc-lib/src/lib/components/cli-wrapper/cli-wrapper.component.html create mode 100644 projects/arc-lib/src/lib/components/cli-wrapper/cli-wrapper.component.scss create mode 100644 projects/arc-lib/src/lib/components/cli-wrapper/cli-wrapper.component.ts diff --git a/projects/arc-docs/src/app/docs/docs-routing.module.ts b/projects/arc-docs/src/app/docs/docs-routing.module.ts index 337ca65..e73871d 100644 --- a/projects/arc-docs/src/app/docs/docs-routing.module.ts +++ b/projects/arc-docs/src/app/docs/docs-routing.module.ts @@ -14,6 +14,11 @@ const routes: Routes = [ m => m.GettingStartedModule, ), }, + { + path: 'guide', + loadChildren: () => + import('./guide/guide.module').then(m => m.GuideModule), + }, ], }, ]; diff --git a/projects/arc-docs/src/app/docs/docs.component.html b/projects/arc-docs/src/app/docs/docs.component.html index 8d4d663..bb2ea85 100644 --- a/projects/arc-docs/src/app/docs/docs.component.html +++ b/projects/arc-docs/src/app/docs/docs.component.html @@ -1,4 +1,3 @@ -
diff --git a/projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.html b/projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.html new file mode 100644 index 0000000..22cfe0c --- /dev/null +++ b/projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.html @@ -0,0 +1 @@ +

backend-integration-doc works!

diff --git a/projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.scss b/projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.spec.ts b/projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.spec.ts new file mode 100644 index 0000000..c587c36 --- /dev/null +++ b/projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.spec.ts @@ -0,0 +1,22 @@ +import {ComponentFixture, TestBed} from '@angular/core/testing'; + +import {BackendIntegrationDocComponent} from './backend-integration-doc.component'; + +describe('BackendIntegrationDocComponent', () => { + let component: BackendIntegrationDocComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [BackendIntegrationDocComponent], + }).compileComponents(); + + fixture = TestBed.createComponent(BackendIntegrationDocComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.ts b/projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.ts new file mode 100644 index 0000000..51abf29 --- /dev/null +++ b/projects/arc-docs/src/app/docs/guide/components/backend-integration-doc/backend-integration-doc.component.ts @@ -0,0 +1,8 @@ +import {Component} from '@angular/core'; + +@Component({ + selector: 'app-backend-integration-doc', + templateUrl: './backend-integration-doc.component.html', + styleUrls: ['./backend-integration-doc.component.scss'], +}) +export class BackendIntegrationDocComponent {} diff --git a/projects/arc-docs/src/app/docs/guide/components/clone-boilerplate-doc/clone-boilerplate-doc.component.scss b/projects/arc-docs/src/app/docs/guide/components/clone-boilerplate-doc/clone-boilerplate-doc.component.scss new file mode 100644 index 0000000..a598003 --- /dev/null +++ b/projects/arc-docs/src/app/docs/guide/components/clone-boilerplate-doc/clone-boilerplate-doc.component.scss @@ -0,0 +1,51 @@ +.section { + margin-bottom: 20px; +} + +.section-title { + margin-bottom: 10px; +} + +.explore { + a { + color: #19a5ff; + text-decoration: none; + } +} + +.cli-wrapper { + margin-top: 5px; + margin-bottom: 5px; + .cli { + color: #fff; + font-family: monospace; + align-items: baseline; + border-radius: 2px; + white-space: pre-wrap; + .cli-header { + display: flex; + align-items: center; + justify-content: space-between; + background: #676767; + padding: 1px 10px; + border-top-left-radius: 5px; + border-top-right-radius: 5px; + + h5 { + margin: 0; + font-size: 0.8rem; + } + } + .cli-content { + background: black; + border-bottom-left-radius: 5px; + border-bottom-right-radius: 5px; + text-align: left; + padding: 15px 5px; + pre { + margin: 0; + display: inline-block !important; + } + } + } +} diff --git a/projects/arc-docs/src/app/docs/guide/components/clone-boilerplate-doc/clone-boilerplate-doc.component.spec.ts b/projects/arc-docs/src/app/docs/guide/components/clone-boilerplate-doc/clone-boilerplate-doc.component.spec.ts new file mode 100644 index 0000000..ea4cbd5 --- /dev/null +++ b/projects/arc-docs/src/app/docs/guide/components/clone-boilerplate-doc/clone-boilerplate-doc.component.spec.ts @@ -0,0 +1,22 @@ +import {ComponentFixture, TestBed} from '@angular/core/testing'; + +import {CloneBoilerplateDocComponent} from './clone-boilerplate-doc.component'; + +describe('CloneBoilerplateDocComponent', () => { + let component: CloneBoilerplateDocComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [CloneBoilerplateDocComponent], + }).compileComponents(); + + fixture = TestBed.createComponent(CloneBoilerplateDocComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/projects/arc-docs/src/app/docs/guide/components/clone-boilerplate-doc/clone-boilerplate-doc.component.ts b/projects/arc-docs/src/app/docs/guide/components/clone-boilerplate-doc/clone-boilerplate-doc.component.ts new file mode 100644 index 0000000..8a280e2 --- /dev/null +++ b/projects/arc-docs/src/app/docs/guide/components/clone-boilerplate-doc/clone-boilerplate-doc.component.ts @@ -0,0 +1,26 @@ +import {Component} from '@angular/core'; + +@Component({ + selector: 'app-clone-boilerplate-doc', + templateUrl: './clone-boilerplate-doc.component.html', + styleUrls: ['./clone-boilerplate-doc.component.scss'], +}) +export class CloneBoilerplateDocComponent { + yourDataList: object[] = [ + { + lable: 'Navigate to Desired Directory:', + listData: 'cd path/to/your/directory', + }, + { + lable: 'Clone the Repository:', + listData: 'git clone https://github.com/sourcefuse/angular-boilerplate', + }, + { + lable: 'Navigate into the Cloned Directory', + listData: 'cd your-boilerplate-project-name', + }, + ]; + addItem(newItem: object) { + this.yourDataList.push(newItem); + } +} diff --git a/projects/arc-docs/src/app/docs/guide/guide-routing.module.ts b/projects/arc-docs/src/app/docs/guide/guide-routing.module.ts new file mode 100644 index 0000000..9d67122 --- /dev/null +++ b/projects/arc-docs/src/app/docs/guide/guide-routing.module.ts @@ -0,0 +1,22 @@ +import {NgModule} from '@angular/core'; +import {RouterModule, Routes} from '@angular/router'; +import {BackendIntegrationDocComponent} from './components/backend-integration-doc/backend-integration-doc.component'; +import {CloneBoilerplateDocComponent} from './components/clone-boilerplate-doc/clone-boilerplate-doc.component'; + +const routes: Routes = [ + { + path: '', + redirectTo: 'clone', + pathMatch: 'full', + }, + { + path: 'clone', + component: CloneBoilerplateDocComponent, + }, +]; + +@NgModule({ + imports: [RouterModule.forChild(routes)], + exports: [RouterModule], +}) +export class GuideRoutingModule {} diff --git a/projects/arc-docs/src/app/docs/guide/guide.module.ts b/projects/arc-docs/src/app/docs/guide/guide.module.ts new file mode 100644 index 0000000..a0f8c99 --- /dev/null +++ b/projects/arc-docs/src/app/docs/guide/guide.module.ts @@ -0,0 +1,14 @@ +import {NgModule} from '@angular/core'; +import {CommonModule} from '@angular/common'; + +import {GuideRoutingModule} from './guide-routing.module'; +import {CloneBoilerplateDocComponent} from './components/clone-boilerplate-doc/clone-boilerplate-doc.component'; +import {BackendIntegrationDocComponent} from './components/backend-integration-doc/backend-integration-doc.component'; +import {ThemeModule} from '@project-lib/theme/theme.module'; +import {CliWrapperComponent} from '@project-lib/components/cli-wrapper/cli-wrapper.component'; + +@NgModule({ + declarations: [CloneBoilerplateDocComponent, BackendIntegrationDocComponent], + imports: [CommonModule, GuideRoutingModule, ThemeModule, CliWrapperComponent], +}) +export class GuideModule {} diff --git a/projects/arc-lib/src/lib/components/cli-wrapper/cli-wrapper.component.html b/projects/arc-lib/src/lib/components/cli-wrapper/cli-wrapper.component.html new file mode 100644 index 0000000..4780f3d --- /dev/null +++ b/projects/arc-lib/src/lib/components/cli-wrapper/cli-wrapper.component.html @@ -0,0 +1,13 @@ + +
+
+
+
bash
+
+
+ + {{ command }} + +
+
+
diff --git a/projects/arc-lib/src/lib/components/cli-wrapper/cli-wrapper.component.scss b/projects/arc-lib/src/lib/components/cli-wrapper/cli-wrapper.component.scss new file mode 100644 index 0000000..a2295c7 --- /dev/null +++ b/projects/arc-lib/src/lib/components/cli-wrapper/cli-wrapper.component.scss @@ -0,0 +1,36 @@ +.cli-wrapper { + margin-top: 5px; + margin-bottom: 5px; + .cli { + color: #fff; + font-family: monospace; + align-items: baseline; + border-radius: 2px; + white-space: pre-wrap; + .cli-header { + display: flex; + align-items: center; + justify-content: space-between; + background: #676767; + padding: 1px 10px; + border-top-left-radius: 5px; + border-top-right-radius: 5px; + + h5 { + margin: 0; + font-size: 0.8rem; + } + } + .cli-content { + background: black; + border-bottom-left-radius: 5px; + border-bottom-right-radius: 5px; + text-align: left; + padding: 15px 5px; + pre { + margin: 0; + display: inline-block !important; + } + } + } +} diff --git a/projects/arc-lib/src/lib/components/cli-wrapper/cli-wrapper.component.ts b/projects/arc-lib/src/lib/components/cli-wrapper/cli-wrapper.component.ts new file mode 100644 index 0000000..2e9456a --- /dev/null +++ b/projects/arc-lib/src/lib/components/cli-wrapper/cli-wrapper.component.ts @@ -0,0 +1,13 @@ +import {Component, Input} from '@angular/core'; +import {CommonModule} from '@angular/common'; + +@Component({ + selector: 'lib-cli-wrapper', + standalone: true, + imports: [CommonModule], + templateUrl: './cli-wrapper.component.html', + styleUrls: ['./cli-wrapper.component.scss'], +}) +export class CliWrapperComponent { + @Input() command: string; // Define an input property to receive command data +} diff --git a/projects/arc/src/app/main/home/home.component.scss b/projects/arc/src/app/main/home/home.component.scss index 6a15d58..c77a8e2 100644 --- a/projects/arc/src/app/main/home/home.component.scss +++ b/projects/arc/src/app/main/home/home.component.scss @@ -38,7 +38,7 @@ margin-bottom: 10px; } } - } + } .row { width: 100%; display: flex; diff --git a/projects/arc/src/styles.scss b/projects/arc/src/styles.scss index 7d148b9..cec15b5 100644 --- a/projects/arc/src/styles.scss +++ b/projects/arc/src/styles.scss @@ -289,30 +289,27 @@ nb-toast.status-success .icon-container { } } - @media (max-width: 576px) { .card-row { padding: 30px 20px; - .sign-in-title { - h2 { - font-size: 36px; - margin: 50px 0 10px 0; - } - h3 { - font-size: 18px; - color: #525252; - margin: 0; + .sign-in-title { + h2 { + font-size: 36px; + margin: 50px 0 10px 0; + } + h3 { + font-size: 18px; + color: #525252; + margin: 0; + } + p { + font-size: 14px; + margin: 0 0 30px 0; + } } - p { - font-size: 14px; - margin: 0 0 30px 0; - } - } } -.main-wrapper { - padding-top: 0px !important; -} - + .main-wrapper { + padding-top: 0px !important; + } } -