Skip to content

Commit 3e0b4d1

Browse files
Merge pull request #488 from shanmukhateja/feat-table-element
Feat table element
2 parents 93f5595 + cc4331c commit 3e0b4d1

22 files changed

+408
-3
lines changed

CONTRIBUTING.md

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,13 @@ npm install
77
```
88

99
## Build Libraries
10+
1011
```shell
1112
npm run build:lib
1213
```
1314

1415
## Build Portal
16+
1517
```shell
1618
npm run serve:app
1719
```
@@ -65,7 +67,6 @@ to read on GitHub as well as in various git tools.
6567

6668
The footer should contain a [closing reference to an issue](https://help.github.com/articles/closing-issues-via-commit-messages/) if any.
6769

68-
6970
```
7071
docs(changelog): update changelog to beta.5
7172
```
@@ -111,7 +112,7 @@ The following is the list of supported scopes:
111112
- **panel**
112113
- **tabs**
113114
- **dropdown**
114-
115+
- **table**
115116

116117
### Subject
117118

@@ -149,4 +150,4 @@ Previous code example here
149150
AFTER:
150151
151152
New code example here
152-
```
153+
```

projects/bulma-app/src/app/app-routing.module.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,11 @@ const routes: Routes = [
5757
loadChildren: () =>
5858
import('./progressbar/progressbar.module').then((progress) => progress.ProgressbarModule),
5959
},
60+
{
61+
path: 'elements/table',
62+
loadChildren: () =>
63+
import('./table/table.module').then((table) => table.TableModule),
64+
},
6065
{
6166
path: 'layout/container',
6267
loadChildren: () =>

projects/bulma-app/src/app/navbar/doc-navbar/doc-navbar.component.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,8 @@
6262
>
6363
<hr class="navbar-divider" />
6464
<a buNavItem [routerLink]="['elements/tag']" routerLinkActive="router-link-active">Tag</a>
65+
<hr class="navbar-divider" />
66+
<a buNavItem [routerLink]="['elements/table']" routerLinkActive="router-link-active">Table</a>
6567
</bu-navbar-dropdown>
6668
</bu-navbar-link>
6769
<bu-navbar-link title="Form">
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import { NgModule } from '@angular/core';
2+
import { Routes, RouterModule } from '@angular/router';
3+
import { TableComponent } from './table.component';
4+
5+
6+
const routes: Routes = [
7+
{
8+
path: '',
9+
component: TableComponent
10+
}
11+
];
12+
13+
@NgModule({
14+
imports: [RouterModule.forChild(routes)],
15+
exports: [RouterModule]
16+
})
17+
export class TableRoutingModule { }

projects/bulma-app/src/app/table/table.component.css

Whitespace-only changes.
Lines changed: 130 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,130 @@
1+
<markdown src="assets/docs/table/table-text.md"></markdown>
2+
<br />
3+
4+
<h4>Default</h4>
5+
<div class="columns">
6+
<div class="column is-6">
7+
<markdown src="assets/docs/table/table-default.md"></markdown>
8+
</div>
9+
<div class="column is-3">
10+
<table class="table" buTable>
11+
<thead>
12+
<tr>
13+
<th>One</th>
14+
<th>Two</th>
15+
</tr>
16+
</thead>
17+
<tbody>
18+
<tr>
19+
<td>Three</td>
20+
<td>Four</td>
21+
</tr>
22+
</tbody>
23+
</table>
24+
</div>
25+
</div>
26+
<br />
27+
28+
<h4>Bordered</h4>
29+
<div class="columns">
30+
<div class="column is-6">
31+
<markdown src="assets/docs/table/table-bordered.md"></markdown>
32+
</div>
33+
<div class="column is-3">
34+
<table class="table" buTable bordered="true">
35+
<thead>
36+
<tr>
37+
<th>One</th>
38+
<th>Two</th>
39+
</tr>
40+
</thead>
41+
<tbody>
42+
<tr>
43+
<td>Three</td>
44+
<td>Four</td>
45+
</tr>
46+
</tbody>
47+
</table>
48+
</div>
49+
</div>
50+
<br />
51+
52+
<h4>Striped</h4>
53+
<div class="columns">
54+
<div class="column is-6">
55+
<markdown src="assets/docs/table/table-striped.md"></markdown>
56+
</div>
57+
<div class="column is-3">
58+
<table class="table" buTable striped="true">
59+
<thead>
60+
<tr>
61+
<th>One</th>
62+
<th>Two</th>
63+
</tr>
64+
</thead>
65+
<tbody>
66+
<tr>
67+
<td>Three</td>
68+
<td>Four</td>
69+
</tr>
70+
<tr>
71+
<td>Five</td>
72+
<td>Six</td>
73+
</tr>
74+
<tr>
75+
<td>Seven</td>
76+
<td>Eight</td>
77+
</tr>
78+
</tbody>
79+
</table>
80+
</div>
81+
</div>
82+
<br />
83+
84+
<h4>Hoverable</h4>
85+
<div class="columns">
86+
<div class="column is-6">
87+
<markdown src="assets/docs/table/table-hoverable.md"></markdown>
88+
</div>
89+
<div class="column is-3">
90+
<table class="table" buTable hoverable="true">
91+
<thead>
92+
<tr>
93+
<th>One</th>
94+
<th>Two</th>
95+
</tr>
96+
</thead>
97+
<tbody>
98+
<tr>
99+
<td>Three</td>
100+
<td>Four</td>
101+
</tr>
102+
</tbody>
103+
</table>
104+
</div>
105+
</div>
106+
<br />
107+
108+
<h4>Full Width</h4>
109+
<div class="columns">
110+
<div class="column is-6">
111+
<markdown src="assets/docs/table/table-fullWidth.md"></markdown>
112+
</div>
113+
<div class="column">
114+
<table class="table" buTable fullWidth="true">
115+
<thead>
116+
<tr>
117+
<th>One</th>
118+
<th>Two</th>
119+
</tr>
120+
</thead>
121+
<tbody>
122+
<tr>
123+
<td>Three</td>
124+
<td>Four</td>
125+
</tr>
126+
</tbody>
127+
</table>
128+
</div>
129+
</div>
130+
<br />
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2+
3+
import { TableComponent } from './table.component';
4+
5+
describe('TableComponent', () => {
6+
let component: TableComponent;
7+
let fixture: ComponentFixture<TableComponent>;
8+
9+
beforeEach(async(() => {
10+
TestBed.configureTestingModule({
11+
declarations: [ TableComponent ]
12+
})
13+
.compileComponents();
14+
}));
15+
16+
beforeEach(() => {
17+
fixture = TestBed.createComponent(TableComponent);
18+
component = fixture.componentInstance;
19+
fixture.detectChanges();
20+
});
21+
22+
it('should create', () => {
23+
expect(component).toBeTruthy();
24+
});
25+
});
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { Component, OnInit } from '@angular/core';
2+
3+
@Component({
4+
selector: 'app-table',
5+
templateUrl: './table.component.html',
6+
styleUrls: ['./table.component.css']
7+
})
8+
export class TableComponent implements OnInit {
9+
10+
constructor() { }
11+
12+
ngOnInit(): void {
13+
}
14+
15+
}
Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import { NgModule } from '@angular/core';
2+
import { CommonModule } from '@angular/common';
3+
4+
import { TableRoutingModule } from './table-routing.module';
5+
import { BulmaTableModule } from '@ngx-builders/ngx-bulma/table';
6+
import { MarkdownModule } from 'ngx-markdown';
7+
import { HttpClient } from '@angular/common/http';
8+
import { TableComponent } from './table.component';
9+
10+
@NgModule({
11+
declarations: [TableComponent],
12+
imports: [
13+
CommonModule,
14+
TableRoutingModule,
15+
BulmaTableModule,
16+
MarkdownModule.forRoot({loader: HttpClient})
17+
]
18+
})
19+
export class TableModule { }
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
```javascript
2+
<table class="table" buTable bordered="true">
3+
<thead>
4+
<tr>
5+
<th>One</th>
6+
<th>Two</th>
7+
</tr>
8+
</thead>
9+
<tbody>
10+
<tr>
11+
<td>Three</td>
12+
<td>Four</td>
13+
</tr>
14+
</tbody>
15+
</table>
16+
```

0 commit comments

Comments
 (0)