Skip to content

Commit 6d6f566

Browse files
pavankjaddapavankjadda
authored
chore(docs): remove center alignment from README and update Angular v… …ersion reference to 20 (#137)
2 parents 36fc2b6 + fafb7dc commit 6d6f566

File tree

4 files changed

+35
-37
lines changed

4 files changed

+35
-37
lines changed

‎README.md

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,11 @@
22

33
Reusable Angular components built with Angular Material and Bootstrap 5.x, Utility classes/functions for Date, Form and String operations
44

5-
<p align="center">
6-
75
[![CI](https://github.com/js-smart/ng-kit/actions/workflows/build.yml/badge.svg?branch=main)](https://github.com/js-smart/ng-kit/actions/workflows/build.yml)
86
<a href="https://www.npmjs.com/@js-smart/ng-kit">
97
<img src="https://img.shields.io/npm/v/@js-smart/ng-kit" alt="Ng Kit on npm" />
108
</a>
11-
</p>
9+
1210

1311
### Installation
1412

‎projects/ng-kit-demo/src/app/ngx-print-demo/ngx-print-demo.html

Lines changed: 28 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,42 @@
1-
<div class="m-2 container">
1+
<div class="m-2 container-fluid">
22
<div class="row">
33
<div class="col-12">
44
<h2 class="text-center">NGX Print Directive Demo</h2>
55
<p class="text-center">This is a demo of the NGX Print Directive. It is used to print the table to a PDF
66
file.</p>
77
<div class="text-center">
88
<button [hideMatTablePaginator]="true" [isMatTable]="true" [matTableDataSource]="dataSource"
9-
[paginator]="paginator" [useExistingCss]="true" class="pdf-export-button form-col-2" mat-raised-button
10-
ngxPrint paginatorId="mat-paginator" printSectionId="print_id" color="primary" type="button">
9+
[paginator]="paginator" [useExistingCss]="true" class="pdf-export-button form-col-2" viewPrimaryButton
10+
[icon]="'print'" mat-raised-button ngxPrint paginatorId="mat-paginator" printSectionId="print_id"
11+
type="button">
1112
Export to PDF
1213
</button>
1314
</div>
1415
</div>
1516
</div>
1617

18+
<!-- Generate Mat Table with sorting and pagination -->
19+
<table mat-table class="m-5" [dataSource]="dataSource" matSort matSortActive="name" matSortDirection="asc"
20+
id="print_id">
21+
<ng-container matColumnDef="name">
22+
<mat-header-cell *matHeaderCellDef mat-sort-header> Name </mat-header-cell>
23+
<mat-cell *matCellDef="let element"> {{ element.name }} </mat-cell>
24+
</ng-container>
25+
<ng-container matColumnDef="email">
26+
<mat-header-cell *matHeaderCellDef mat-sort-header> Email </mat-header-cell>
27+
<mat-cell *matCellDef="let element"> {{ element.email }} </mat-cell>
28+
</ng-container>
29+
<ng-container matColumnDef="phone">
30+
<mat-header-cell *matHeaderCellDef mat-sort-header> Phone </mat-header-cell>
31+
<mat-cell *matCellDef="let element"> {{ element.phone }} </mat-cell>
32+
</ng-container>
33+
<ng-container matColumnDef="website">
34+
<mat-header-cell *matHeaderCellDef mat-sort-header> Website </mat-header-cell>
35+
<mat-cell *matCellDef="let element"> {{ element.website }} </mat-cell>
36+
</ng-container>
37+
<mat-header-row *matHeaderRowDef="['name', 'email', 'phone', 'website']"></mat-header-row>
38+
<mat-row *matRowDef="let row; columns: ['name', 'email', 'phone', 'website']"></mat-row>
39+
</table>
40+
<mat-paginator id="mat-paginator" [pageSize]="5" [pageSizeOptions]="[5,10, 20, 50, 100]"
41+
[length]="result.value()?.length ?? 0"></mat-paginator>
1742
</div>
18-
<!-- Generate Mat Table with sorting and pagination -->
19-
<table mat-table class="m-5" [dataSource]="dataSource" matSort matSortActive="name" matSortDirection="asc"
20-
id="print_id">
21-
<ng-container matColumnDef="name">
22-
<mat-header-cell *matHeaderCellDef mat-sort-header> Name </mat-header-cell>
23-
<mat-cell *matCellDef="let element"> {{ element.name }} </mat-cell>
24-
</ng-container>
25-
<ng-container matColumnDef="email">
26-
<mat-header-cell *matHeaderCellDef mat-sort-header> Email </mat-header-cell>
27-
<mat-cell *matCellDef="let element"> {{ element.email }} </mat-cell>
28-
</ng-container>
29-
<ng-container matColumnDef="phone">
30-
<mat-header-cell *matHeaderCellDef mat-sort-header> Phone </mat-header-cell>
31-
<mat-cell *matCellDef="let element"> {{ element.phone }} </mat-cell>
32-
</ng-container>
33-
<ng-container matColumnDef="website">
34-
<mat-header-cell *matHeaderCellDef mat-sort-header> Website </mat-header-cell>
35-
<mat-cell *matCellDef="let element"> {{ element.website }} </mat-cell>
36-
</ng-container>
37-
<mat-header-row *matHeaderRowDef="['name', 'email', 'phone', 'website']"></mat-header-row>
38-
<mat-row *matRowDef="let row; columns: ['name', 'email', 'phone', 'website']"></mat-row>
39-
</table>
40-
<mat-paginator id="mat-paginator" [pageSize]="5" [pageSizeOptions]="[5,10, 20, 50, 100]"
41-
[length]="result.value()?.length ?? 0"></mat-paginator>
42-
<hr />

‎projects/ng-kit-demo/src/app/ngx-print-demo/ngx-print-demo.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { MatButtonModule } from '@angular/material/button';
44
import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
55
import { MatSort, MatSortModule } from '@angular/material/sort';
66
import { MatTableDataSource, MatTableModule } from '@angular/material/table';
7-
import { NgxPrintDirective } from '@js-smart/ng-kit';
7+
import { NgxPrintDirective, ViewPrimaryButtonDirective } from '@js-smart/ng-kit';
88

99
interface User {
1010
id: number;
@@ -16,7 +16,7 @@ interface User {
1616

1717
@Component({
1818
selector: 'ngx-print-demo',
19-
imports: [MatTableModule, MatPaginatorModule, MatSortModule, NgxPrintDirective, MatButtonModule],
19+
imports: [MatTableModule, MatPaginatorModule, MatSortModule, NgxPrintDirective, MatButtonModule, ViewPrimaryButtonDirective],
2020
templateUrl: './ngx-print-demo.html',
2121
styles: [``],
2222
changeDetection: ChangeDetectionStrategy.OnPush,

‎projects/ng-kit/README.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,12 @@
22

33
Reusable Angular components built with Angular Material and Bootstrap 5.x, Utility classes/functions for Date, Form and String operations
44

5-
<p align="center">
5+
66
[![CI](https://github.com/js-smart/ng-kit/actions/workflows/build.yml/badge.svg?branch=main)](https://github.com/js-smart/ng-kit/actions/workflows/build.yml)
77
<a href="https://www.npmjs.com/@js-smart/ng-kit">
88
<img src="https://img.shields.io/npm/v/@js-smart/ng-kit" alt="Ngx Cookie Service on npm" />
99
</a>
10-
</p>
10+
1111

1212
### Installation
1313

@@ -21,8 +21,8 @@ and use it as shown below in each section
2121

2222
### Technologies
2323

24-
1. Angular 17+
25-
2. Bootstrap 5+ (if applicable)
24+
1. Angular 20
25+
2. Bootstrap 5+
2626

2727
## Auto Complete
2828

0 commit comments

Comments
 (0)