Skip to content

Commit 7ea5b3e

Browse files
ismcagdasismcagdas
committed
style changes on Angular template
1 parent b433bfb commit 7ea5b3e

File tree

8 files changed

+110
-115
lines changed

8 files changed

+110
-115
lines changed

‎angular/src/app/app-routing.module.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,8 +20,8 @@ import { ChangePasswordComponent } from './users/change-password/change-password
2020
{ path: 'users', component: UsersComponent, data: { permission: 'Pages.Users' }, canActivate: [AppRouteGuard] },
2121
{ path: 'roles', component: RolesComponent, data: { permission: 'Pages.Roles' }, canActivate: [AppRouteGuard] },
2222
{ path: 'tenants', component: TenantsComponent, data: { permission: 'Pages.Tenants' }, canActivate: [AppRouteGuard] },
23-
{ path: 'about', component: AboutComponent },
24-
{ path: 'update-password', component: ChangePasswordComponent }
23+
{ path: 'about', component: AboutComponent, canActivate: [AppRouteGuard] },
24+
{ path: 'update-password', component: ChangePasswordComponent, canActivate: [AppRouteGuard] }
2525
]
2626
}
2727
])

‎angular/src/app/home/home.component.html

Lines changed: 29 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,14 @@ <h1>{{ "HomePage" | localize }}</h1>
1010
</section>
1111
<section class="content px-2">
1212
<div class="container-fluid">
13+
<div class="row">
14+
<div class="col-12">
15+
<div class="alert alert-info alert-dismissible">
16+
<h6><i class="icon fa fa-info"></i> This is a sample Dashboard which doesn't show any server side data.
17+
However, you can develop your own dashboard inspired by this one and its source code.</h6>
18+
</div>
19+
</div>
20+
</div>
1321
<div class="row">
1422
<div class="col-lg-3 col-6">
1523
<div class="small-box bg-success">
@@ -20,11 +28,9 @@ <h3>8.2k+</h3>
2028
<div class="icon">
2129
<i class="fas fa-star"></i>
2230
</div>
23-
<a
24-
href="https://github.com/aspnetboilerplate/aspnetboilerplate/stargazers"
31+
<a href="https://github.com/aspnetboilerplate/aspnetboilerplate/stargazers"
2532
class="small-box-footer"
26-
target="_blank"
27-
>
33+
target="_blank">
2834
More info
2935
<i class="fas fa-arrow-circle-right"></i>
3036
</a>
@@ -39,11 +45,9 @@ <h3>140+</h3>
3945
<div class="icon">
4046
<i class="fas fa-users"></i>
4147
</div>
42-
<a
43-
href="https://github.com/aspnetboilerplate/aspnetboilerplate/graphs/contributors"
48+
<a href="https://github.com/aspnetboilerplate/aspnetboilerplate/graphs/contributors"
4449
class="small-box-footer"
45-
target="_blank"
46-
>
50+
target="_blank">
4751
More info
4852
<i class="fas fa-arrow-circle-right"></i>
4953
</a>
@@ -58,11 +62,9 @@ <h3>1.6k+</h3>
5862
<div class="icon">
5963
<i class="fas fa-tools"></i>
6064
</div>
61-
<a
62-
href="https://github.com/aspnetboilerplate/aspnetboilerplate/network/dependents"
65+
<a href="https://github.com/aspnetboilerplate/aspnetboilerplate/network/dependents"
6366
class="small-box-footer"
64-
target="_blank"
65-
>
67+
target="_blank">
6668
More info
6769
<i class="fas fa-arrow-circle-right"></i>
6870
</a>
@@ -77,11 +79,9 @@ <h3>3.1k+</h3>
7779
<div class="icon">
7880
<i class="fas fa-code"></i>
7981
</div>
80-
<a
81-
href="https://github.com/aspnetboilerplate/aspnetboilerplate/network/members"
82+
<a href="https://github.com/aspnetboilerplate/aspnetboilerplate/network/members"
8283
class="small-box-footer"
83-
target="_blank"
84-
>
84+
target="_blank">
8585
More info
8686
<i class="fas fa-arrow-circle-right"></i>
8787
</a>
@@ -163,10 +163,8 @@ <h3 class="card-title">Open Issues</h3>
163163
<tbody>
164164
<tr>
165165
<td>
166-
<a
167-
href="https://github.com/aspnetboilerplate/aspnetboilerplate/issues/5452"
168-
target="_blank"
169-
>
166+
<a href="https://github.com/aspnetboilerplate/aspnetboilerplate/issues/5452"
167+
target="_blank">
170168
5452
171169
</a>
172170
</td>
@@ -184,10 +182,8 @@ <h3 class="card-title">Open Issues</h3>
184182
</tr>
185183
<tr>
186184
<td>
187-
<a
188-
href="https://github.com/aspnetboilerplate/aspnetboilerplate/issues/5391"
189-
target="_blank"
190-
>
185+
<a href="https://github.com/aspnetboilerplate/aspnetboilerplate/issues/5391"
186+
target="_blank">
191187
5391
192188
</a>
193189
</td>
@@ -208,10 +204,8 @@ <h3 class="card-title">Open Issues</h3>
208204
</tr>
209205
<tr>
210206
<td>
211-
<a
212-
href="https://github.com/aspnetboilerplate/aspnetboilerplate/issues/5390"
213-
target="_blank"
214-
>
207+
<a href="https://github.com/aspnetboilerplate/aspnetboilerplate/issues/5390"
208+
target="_blank">
215209
5390
216210
</a>
217211
</td>
@@ -251,10 +245,8 @@ <h3 class="card-title">Closed Pull Requests</h3>
251245
<tbody>
252246
<tr>
253247
<td>
254-
<a
255-
href="https://github.com/aspnetboilerplate/aspnetboilerplate/pull/5430"
256-
target="_blank"
257-
>
248+
<a href="https://github.com/aspnetboilerplate/aspnetboilerplate/pull/5430"
249+
target="_blank">
258250
5430
259251
</a>
260252
</td>
@@ -267,10 +259,8 @@ <h3 class="card-title">Closed Pull Requests</h3>
267259
</tr>
268260
<tr>
269261
<td>
270-
<a
271-
href="https://github.com/aspnetboilerplate/aspnetboilerplate/pull/5362"
272-
target="_blank"
273-
>
262+
<a href="https://github.com/aspnetboilerplate/aspnetboilerplate/pull/5362"
263+
target="_blank">
274264
5362
275265
</a>
276266
</td>
@@ -283,10 +273,8 @@ <h3 class="card-title">Closed Pull Requests</h3>
283273
</tr>
284274
<tr>
285275
<td>
286-
<a
287-
href="https://github.com/aspnetboilerplate/aspnetboilerplate/pull/4924"
288-
target="_blank"
289-
>
276+
<a href="https://github.com/aspnetboilerplate/aspnetboilerplate/pull/4924"
277+
target="_blank">
290278
4924
291279
</a>
292280
</td>
@@ -305,4 +293,4 @@ <h3 class="card-title">Closed Pull Requests</h3>
305293
</div>
306294
</div>
307295
</section>
308-
</div>
296+
</div>

‎angular/src/app/layout/sidebar-menu.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ export class SidebarMenuComponent extends AppComponentBase implements OnInit {
1919
menuItemsMap: { [key: number]: MenuItem } = {};
2020
activatedMenuItems: MenuItem[] = [];
2121
routerEvents: BehaviorSubject<RouterEvent> = new BehaviorSubject(undefined);
22-
homeRoute = '/app/home';
22+
homeRoute = '/app/about';
2323

2424
constructor(injector: Injector, private router: Router) {
2525
super(injector);

‎angular/src/app/roles/roles.component.html

Lines changed: 60 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,9 @@
66
<h1>{{ "Roles" | localize }}</h1>
77
</div>
88
<div class="col-6 text-right">
9-
<a href="javascript:;" class="btn bg-blue" (click)="createRole()">
9+
<a href="javascript:;"
10+
class="btn bg-blue"
11+
(click)="createRole()">
1012
<i class="fa fa-plus-square"></i>
1113
{{ "Create" | localize }}
1214
</a>
@@ -18,44 +20,40 @@ <h1>{{ "Roles" | localize }}</h1>
1820
<div class="container-fluid">
1921
<div class="card">
2022
<div class="card-header">
21-
<div class="row">
22-
<div class="col-md-6">&emsp;</div>
23-
<div class="col-md-6">
24-
<div class="input-group">
25-
<div class="input-group-prepend">
26-
<button
27-
type="button"
28-
class="btn bg-blue"
29-
(click)="getDataPage(1)"
30-
>
31-
<i class="fas fa-search"></i>
32-
</button>
33-
</div>
34-
<input
35-
type="text"
36-
class="form-control"
37-
name="keyword"
38-
[placeholder]="'SearchWithThreeDot' | localize"
39-
[(ngModel)]="keyword"
40-
(keyup.enter)="getDataPage(1)"
41-
/>
42-
</div>
23+
<div class="row">
24+
<div class="col-md-6">&emsp;</div>
25+
<div class="col-md-6">
26+
<div class="input-group">
27+
<div class="input-group-prepend">
28+
<button type="button"
29+
class="btn bg-blue"
30+
(click)="getDataPage(1)">
31+
<i class="fas fa-search"></i>
32+
</button>
4333
</div>
34+
<input type="text"
35+
class="form-control"
36+
name="keyword"
37+
[placeholder]="'SearchWithThreeDot' | localize"
38+
[(ngModel)]="keyword"
39+
(keyup.enter)="getDataPage(1)" />
40+
</div>
4441
</div>
42+
</div>
4543
</div>
4644
<div class="card-body">
47-
<div class="table-responsive">
48-
<table class="table table-striped table-bordered" [busy]="isTableLoading">
49-
<thead class="bg-light">
50-
<tr>
51-
<th>{{ "RoleName" | localize }}</th>
52-
<th>{{ "DisplayName" | localize }}</th>
53-
<th style="width: 200px;">{{ "Actions" | localize }}</th>
54-
</tr>
55-
</thead>
56-
<tbody>
57-
<tr
58-
*ngFor="
45+
<div class="table-responsive">
46+
<table class="table table-striped table-bordered"
47+
[busy]="isTableLoading">
48+
<thead class="bg-light">
49+
<tr>
50+
<th>{{ "RoleName" | localize }}</th>
51+
<th>{{ "DisplayName" | localize }}</th>
52+
<th style="width: 200px;">{{ "Actions" | localize }}</th>
53+
</tr>
54+
</thead>
55+
<tbody>
56+
<tr *ngFor="
5957
let role of roles
6058
| paginate
6159
: {
@@ -64,37 +62,33 @@ <h1>{{ "Roles" | localize }}</h1>
6462
currentPage: pageNumber,
6563
totalItems: totalItems
6664
}
67-
"
68-
>
69-
<td>{{ role.name }}</td>
70-
<td>{{ role.displayName }}</td>
71-
<td>
72-
<button
73-
type="button"
74-
class="btn btn-sm bg-secondary"
75-
(click)="editRole(role)"
76-
>
77-
<i class="fas fa-pencil-alt"></i>
78-
{{ "Edit" | localize }}
79-
</button>
80-
<button
81-
type="button"
82-
class="btn btn-sm bg-danger mx-2"
83-
(click)="delete(role)"
84-
>
85-
<i class="fas fa-trash"></i>
86-
{{ "Delete" | localize }}
87-
</button>
88-
</td>
89-
</tr>
90-
</tbody>
91-
</table>
92-
</div>
65+
">
66+
<td>{{ role.name }}</td>
67+
<td>{{ role.displayName }}</td>
68+
<td>
69+
<button type="button"
70+
class="btn btn-sm bg-secondary"
71+
(click)="editRole(role)">
72+
<i class="fas fa-pencil-alt"></i>
73+
{{ "Edit" | localize }}
74+
</button>
75+
<button type="button"
76+
class="btn btn-sm bg-danger mx-2"
77+
(click)="delete(role)">
78+
<i class="fas fa-trash"></i>
79+
{{ "Delete" | localize }}
80+
</button>
81+
</td>
82+
</tr>
83+
</tbody>
84+
</table>
85+
</div>
9386
</div>
94-
<div class="card-footer bg-light border-top">
87+
<div class="card-footer table-card-footer bg-light border-top">
9588
<div class="row">
9689
<div class="col-sm-4 col-12 text-sm-left text-center">
97-
<button class="btn btn-secondary" (click)="refresh()">
90+
<button class="btn btn-secondary"
91+
(click)="refresh()">
9892
<i class="fas fa-redo-alt"></i>
9993
</button>
10094
</div>
@@ -105,10 +99,8 @@ <h1>{{ "Roles" | localize }}</h1>
10599
</div>
106100
<div class="col-sm-4 col-12">
107101
<div class="float-sm-right m-auto">
108-
<abp-pagination-controls
109-
id="server"
110-
(pageChange)="getDataPage($event)"
111-
>
102+
<abp-pagination-controls id="server"
103+
(pageChange)="getDataPage($event)">
112104
</abp-pagination-controls>
113105
</div>
114106
</div>
@@ -117,4 +109,4 @@ <h1>{{ "Roles" | localize }}</h1>
117109
</div>
118110
</div>
119111
</section>
120-
</div>
112+
</div>

‎angular/src/app/tenants/tenants.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -195,7 +195,7 @@ <h1>{{ "Tenants" | localize }}</h1>
195195
</table>
196196
</div>
197197
</div>
198-
<div class="card-footer bg-light border-top">
198+
<div class="card-footer table-card-footer bg-light border-top">
199199
<div class="row">
200200
<div class="col-sm-4 col-12 text-sm-left text-center">
201201
<button class="btn btn-secondary" (click)="refresh()">

‎angular/src/app/users/users.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -205,7 +205,7 @@ <h1>{{ "Users" | localize }}</h1>
205205
</table>
206206
</div>
207207
</div>
208-
<div class="card-footer bg-light border-top">
208+
<div class="card-footer table-card-footer bg-light border-top">
209209
<div class="row">
210210
<div class="col-sm-4 col-12 text-sm-left text-center">
211211
<button class="btn btn-secondary" (click)="refresh()">

‎angular/src/shared/core.less

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,3 +51,19 @@ div.content-wrapper,
5151
div.sidebar {
5252
min-height: 100vh;
5353
}
54+
55+
table.table {
56+
* {
57+
font-size: 14px !important;
58+
}
59+
60+
th,
61+
td {
62+
padding: 8px;
63+
vertical-align: middle;
64+
}
65+
}
66+
67+
table-card-footer * {
68+
font-size: 14px;
69+
}

‎aspnet-core/src/AbpCompanyName.AbpProjectName.Web.Mvc/Views/Home/Index.cshtml

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,6 @@
3030
<div class="row">
3131
<div class="col-12">
3232
<div class="alert alert-info alert-dismissible">
33-
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
3433
<h6><i class="icon fa fa-info"></i> This is a sample Dashboard which doesn't show any server side data. However, you can develop your own dashboard inspired by this one and its source code.</h6>
3534
</div>
3635
</div>

0 commit comments

Comments
 (0)