Skip to content

Commit 3738f8c

Browse files
committed
Updated documentation.
Updated styles.
1 parent 29e631b commit 3738f8c

File tree

67 files changed

+880
-115
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

67 files changed

+880
-115
lines changed

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# Angular Material Admin Full (v 1.0.0) — Angular-UI Dashboard Template
1+
# Angular Material Admin Full (v 1.0.1) — Angular-UI Dashboard Template
22

33
Built with [Angular](https://angular.io/), [Angular Material](https://material.angular.io/).
44
**No jQuery and Bootstrap!**

changelog.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,11 @@
11
# Changelog
22

3+
## [1.0.1]
4+
5+
### Updated
6+
- Updated project documentation
7+
- Updated styles in project.
8+
39
## [1.0.0]
410

511
### Added

src/app/consts/routes.ts

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,9 +19,15 @@ export enum routes {
1919
//--- Documentation ---//
2020

2121
LIBS = '/documentation/libs',
22+
STRUCTURE = '/documentation/structure',
2223
OVERVIEW = '/documentation/overview',
2324
LICENCES = '/documentation/licences',
2425
QUICK_START = '/documentation/quick start',
26+
CHARTS = '/documentation/charts',
27+
FORMS = '/documentation/forms',
28+
UI = '/documentation/ui',
29+
MAPS = '/documentation/maps',
30+
TABLES = '/documentation/tables',
2531

2632
//--- Core module ---//
2733

@@ -77,9 +83,5 @@ export enum routes {
7783
WIDGET = '/ui/widget',
7884

7985

80-
TABLES = '/tables',
81-
UI_ELEMENTS_ICONS = '/ui/icons',
82-
UI_ELEMENTS_CHARTS = '/ui/charts',
83-
UI_ELEMENTS_MAP = '/ui/map',
8486
LOGIN = '/login'
8587
}

src/app/modules/documentation/documentation-routing.module.ts

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,12 @@ import {LibsPageComponent} from './pages/libs-page/libs-page.component';
55
import {OverviewPageComponent} from './pages/overview-page/overview-page.component';
66
import {LicencesPageComponent} from './pages/licences-page/licences-page.component';
77
import {QuickStartPageComponent} from './pages/quick-start-page/quick-start-page.component';
8+
import {StructurePageComponent} from './pages/structure-page/structure-page.component';
9+
import {ChartsPageComponent} from './pages/charts-page/charts-page.component';
10+
import {FormsPageComponent} from './pages/forms-page/forms-page.component';
11+
import {TablesPageComponent} from './pages/tables-page/tables-page.component';
12+
import {MapsPageComponent} from './pages/maps-page/maps-page.component';
13+
import {UiPageComponent} from './pages/ui-page/ui-page.component';
814

915
const routes: Routes = [
1016
{
@@ -15,6 +21,10 @@ const routes: Routes = [
1521
path: 'libs',
1622
component: LibsPageComponent
1723
},
24+
{
25+
path: 'structure',
26+
component: StructurePageComponent
27+
},
1828
{
1929
path: 'overview',
2030
component: OverviewPageComponent
@@ -26,6 +36,26 @@ const routes: Routes = [
2636
{
2737
path: 'quick start',
2838
component: QuickStartPageComponent
39+
},
40+
{
41+
path: 'charts',
42+
component: ChartsPageComponent
43+
},
44+
{
45+
path: 'forms',
46+
component: FormsPageComponent
47+
},
48+
{
49+
path: 'ui',
50+
component: UiPageComponent
51+
},
52+
{
53+
path: 'maps',
54+
component: MapsPageComponent
55+
},
56+
{
57+
path: 'tables',
58+
component: TablesPageComponent
2959
}
3060
]
3161
}

src/app/modules/documentation/documentation.module.ts

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,11 +14,17 @@ import {MatCardModule} from '@angular/material/card';
1414
import { OverviewPageComponent } from './pages/overview-page/overview-page.component';
1515
import { LicencesPageComponent } from './pages/licences-page/licences-page.component';
1616
import { QuickStartPageComponent } from './pages/quick-start-page/quick-start-page.component';
17+
import { StructurePageComponent } from './pages/structure-page/structure-page.component';
18+
import { ChartsPageComponent } from './pages/charts-page/charts-page.component';
19+
import { FormsPageComponent } from './pages/forms-page/forms-page.component';
20+
import { UiPageComponent } from './pages/ui-page/ui-page.component';
21+
import { MapsPageComponent } from './pages/maps-page/maps-page.component';
22+
import { TablesPageComponent } from './pages/tables-page/tables-page.component';
1723

1824

1925

2026
@NgModule({
21-
declarations: [DocumentationPageComponent, LibsPageComponent, OverviewPageComponent, LicencesPageComponent, QuickStartPageComponent],
27+
declarations: [DocumentationPageComponent, LibsPageComponent, OverviewPageComponent, LicencesPageComponent, QuickStartPageComponent, StructurePageComponent, ChartsPageComponent, FormsPageComponent, UiPageComponent, MapsPageComponent, TablesPageComponent],
2228
imports: [
2329
CommonModule,
2430
DocumentationRoutingModule,
Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
<div class="charts-page">
2+
<app-breadcrumb [path]="routes.CHARTS"></app-breadcrumb>
3+
4+
<mat-card class="chart-card">
5+
<mat-card-title>
6+
<p>Line Chart</p>
7+
</mat-card-title>
8+
9+
<mat-card-content>
10+
<p>Line Chart built with Apexchart JS <a class="link" href="https://apexcharts.com/angular-chart-demos/line-charts/">Line Chart.</a></p>
11+
12+
<p>Installing via npm:</p>
13+
14+
<pre class="code"><code>npm install apexcharts --save</code></pre>
15+
16+
<a class="link" href="https://apexcharts.com/angular-chart-demos/line-charts/basic/">Example</a>
17+
</mat-card-content>
18+
</mat-card>
19+
20+
<mat-card class="chart-card">
21+
<mat-card-title>
22+
<p>Bar Chart</p>
23+
</mat-card-title>
24+
25+
<mat-card-content>
26+
<p>Bar Chart built with Apexchart JS <a class="link" href="https://apexcharts.com/angular-chart-demos/bar-charts/">Bar Chart.</a></p>
27+
28+
<p>Installing via npm:</p>
29+
30+
<pre class="code"><code>npm install apexcharts --save</code></pre>
31+
32+
<a class="link" href="https://apexcharts.com/angular-chart-demos/bar-charts/basic/">Example</a>
33+
</mat-card-content>
34+
</mat-card>
35+
36+
<mat-card class="chart-card">
37+
<mat-card-title>
38+
<p>Pie Chart</p>
39+
</mat-card-title>
40+
41+
<mat-card-content>
42+
<p>Pie Chart built with Apexchart JS <a class="link" href="https://apexcharts.com/angular-chart-demos/pie-charts/">Pie Chart.</a></p>
43+
44+
<p>Installing via npm:</p>
45+
46+
<pre class="code"><code>npm install apexcharts --save</code></pre>
47+
48+
<a class="link" href="https://apexcharts.com/angular-chart-demos/pie-charts/simple-pie/">Example</a>
49+
</mat-card-content>
50+
</mat-card>
51+
52+
<app-footer></app-footer>
53+
</div>
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
@import 'src/app/styles/colors';
2+
3+
.charts-page {
4+
padding: 24px;
5+
}
6+
7+
.chart-card {
8+
margin-top: 24px;
9+
}
10+
11+
.link {
12+
color: $blue;
13+
text-decoration: none;
14+
}
15+
16+
.code {
17+
background-color: $blue-white;
18+
height: auto;
19+
overflow-x: scroll;
20+
overflow-y: hidden;
21+
padding: 8px 16px;
22+
}
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import { Component, OnInit } from '@angular/core';
2+
import {routes} from '../../../../consts';
3+
4+
@Component({
5+
selector: 'app-charts-page',
6+
templateUrl: './charts-page.component.html',
7+
styleUrls: ['./charts-page.component.scss']
8+
})
9+
export class ChartsPageComponent implements OnInit {
10+
public routes: typeof routes = routes;
11+
12+
constructor() { }
13+
14+
ngOnInit(): void {
15+
}
16+
17+
}

src/app/modules/documentation/pages/documentation-page/documentation-page.component.html

Lines changed: 66 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -2,72 +2,105 @@
22

33
<div class="header-title-wrapper">
44
<button mat-mini-fab color="primary" class="header-button">
5-
<mat-icon>menu</mat-icon>
5+
<mat-icon *ngIf="!isShowSidebar" (click)="sidenav.toggle(true)">menu</mat-icon>
6+
<mat-icon *ngIf="isShowSidebar" (click)="sidenav.toggle(false)">arrow_back</mat-icon>
67
</button>
78
<h6 class="header-title">Angular Material Admin Full Documentation</h6>
89
</div>
910

1011
<div class="header-toolbar-wrapper">
11-
<a href="https://twitter.com/flatlogic">
12-
<mat-icon class="header-icon" fontSet="fa fa-fs" fontIcon="fa-twitter"></mat-icon>
13-
</a>
14-
<a href="https://dribbble.com/flatlogic">
15-
<mat-icon class="header-icon" fontSet="fa fa-fs" fontIcon="fa-dribbble"></mat-icon>
16-
</a>
17-
<a href="https://www.facebook.com/flatlogic">
18-
<mat-icon class="header-icon" fontSet="fa fa-fs" fontIcon="fa-facebook"></mat-icon>
19-
</a>
20-
<a href="https://instagram.com/flatlogiccom/">
21-
<mat-icon class="header-icon" fontSet="fa fa-fs" fontIcon="fa-instagram"></mat-icon>
22-
</a>
23-
<a href="https://www.linkedin.com/company/flatlogic/">
24-
<mat-icon class="header-icon" fontSet="fa fa-fs" fontIcon="fa-linkedin"></mat-icon>
25-
</a>
26-
<a href="https://github.com/flatlogic">
27-
<mat-icon class="header-icon" fontSet="fa fa-fs" fontIcon="fa-github"></mat-icon>
28-
</a>
12+
<div class="header-icons-wrapper">
13+
<a href="https://twitter.com/flatlogic">
14+
<mat-icon class="header-icon" fontSet="fa fa-fs" fontIcon="fa-twitter"></mat-icon>
15+
</a>
16+
<a href="https://dribbble.com/flatlogic">
17+
<mat-icon class="header-icon" fontSet="fa fa-fs" fontIcon="fa-dribbble"></mat-icon>
18+
</a>
19+
<a href="https://www.facebook.com/flatlogic">
20+
<mat-icon class="header-icon" fontSet="fa fa-fs" fontIcon="fa-facebook"></mat-icon>
21+
</a>
22+
<a href="https://instagram.com/flatlogiccom/">
23+
<mat-icon class="header-icon" fontSet="fa fa-fs" fontIcon="fa-instagram"></mat-icon>
24+
</a>
25+
<a href="https://www.linkedin.com/company/flatlogic/">
26+
<mat-icon class="header-icon" fontSet="fa fa-fs" fontIcon="fa-linkedin"></mat-icon>
27+
</a>
28+
<a href="https://github.com/flatlogic">
29+
<mat-icon class="header-icon" fontSet="fa fa-fs" fontIcon="fa-github"></mat-icon>
30+
</a>
31+
</div>
2932

30-
<button class="header-button" mat-flat-button color="primary">live preview</button>
31-
<button class="header-button" mat-stroked-button color="warn">buy</button>
33+
<div>
34+
<a href="https://demo.flatlogic.com/angular-material-admin-full">
35+
<button class="header-button" mat-flat-button color="primary">live preview</button>
36+
</a>
37+
<a href="https://flatlogic.com/templates/angular">
38+
<button class="header-button" mat-stroked-button color="warn">buy</button>
39+
</a>
40+
</div>
3241
</div>
3342
</mat-toolbar>
3443

35-
<mat-sidenav-container class="sidebar-wrapper">
44+
<mat-sidenav-container class="documentation-sidebar-wrapper">
3645
<mat-sidenav
3746
#sidenav
3847
mode="side"
3948
[(opened)]="isShowSidebar"
40-
class="layout-sidebar"
49+
class="documentation-sidebar"
4150
[mode]="mobileQuery.matches ? 'over' : 'side'"
4251
[fixedInViewport]="mobileQuery.matches"
4352
>
4453
<mat-list>
4554
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl">
46-
<mat-tree-node *matTreeNodeDef="let node" matTreeNodePadding routerLink="{{node.route}}" routerLinkActive="{{node.active}}">
47-
<div class="sidebar-item-wrapper">
48-
<p class="sidebar-text">{{node.name}}</p>
55+
<mat-tree-node class="mat-node" *matTreeNodeDef="let node" matTreeNodePadding routerLink="{{node.route}}" routerLinkActive="{{node.active}}">
56+
<div class="documentation-sidebar-item-wrapper">
57+
<div class="circle"></div>
58+
<p class="documentation-sidebar-text">{{node.name}}</p>
4959
</div>
5060
</mat-tree-node>
5161

5262
<mat-tree-node *matTreeNodeDef="let node; when: hasChild" class="mat-node">
53-
<div *ngIf="node.name === 'Getting Started'" class="sidebar-item-wrapper" matTreeNodeToggle>
54-
<div class="sidebar-item-title">
55-
<mat-icon class="sidebar-icon">inbox</mat-icon>
56-
<p class="sidebar-text">{{node.name}}</p>
63+
<div *ngIf="node.name === 'Getting Started'" class="documentation-sidebar-node-wrapper" matTreeNodeToggle>
64+
<div class="documentation-sidebar-item-title">
65+
<mat-icon class="documentation-sidebar-icon">inbox</mat-icon>
66+
<p class="documentation-sidebar-text">{{node.name}}</p>
5767
</div>
5868

5969
<mat-icon
60-
class="sidebar-icon"
70+
class="documentation-sidebar-icon"
71+
[ngClass]="{rotateUp: treeControl.isExpanded(node), rotateDown: !treeControl.isExpanded(node)}"
72+
>keyboard_arrow_down
73+
</mat-icon>
74+
</div>
75+
76+
<div *ngIf="node.name === 'Components'" class="documentation-sidebar-node-wrapper" matTreeNodeToggle>
77+
<div class="documentation-sidebar-item-title">
78+
<mat-icon class="documentation-sidebar-icon">filter_none</mat-icon>
79+
<p class="documentation-sidebar-text">{{node.name}}</p>
80+
</div>
81+
82+
<mat-icon
83+
class="documentation-sidebar-icon"
6184
[ngClass]="{rotateUp: treeControl.isExpanded(node), rotateDown: !treeControl.isExpanded(node)}"
6285
>keyboard_arrow_down
6386
</mat-icon>
6487
</div>
6588
</mat-tree-node>
6689
</mat-tree>
6790

68-
<mat-list-item class="sidebar-item-wrapper" routerLink="{{routes.LIBS}}" routerLinkActive="active">
69-
<mat-icon class="sidebar-icon">local_library</mat-icon> <p class="sidebar-text">Libs</p>
91+
<mat-list-item class="documentation-sidebar-item-wrapper" routerLink="{{routes.STRUCTURE}}" routerLinkActive="active">
92+
<mat-icon class="documentation-sidebar-icon">article</mat-icon> <p class="documentation-sidebar-text">Structure</p>
7093
</mat-list-item>
94+
95+
<mat-list-item class="documentation-sidebar-item-wrapper" routerLink="{{routes.LIBS}}" routerLinkActive="active">
96+
<mat-icon class="documentation-sidebar-icon">local_library</mat-icon> <p class="documentation-sidebar-text">Libs</p>
97+
</mat-list-item>
98+
99+
<a href="https://flatlogic.com/templates/angular">
100+
<mat-list-item class="documentation-sidebar-item-wrapper">
101+
<mat-icon class="documentation-sidebar-icon">shopping_cart</mat-icon> <p class="documentation-sidebar-text">Purchase</p>
102+
</mat-list-item>
103+
</a>
71104
</mat-list>
72105
</mat-sidenav>
73106

0 commit comments

Comments
 (0)