Skip to content

Commit 9e79088

Browse files
authored
Boostrap Icons
2 parents a31f2f6 + cb32add commit 9e79088

File tree

3 files changed

+25
-8
lines changed

3 files changed

+25
-8
lines changed

src/main/resources/static/index.css

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -48,3 +48,12 @@
4848
padding: 2%;
4949
}
5050

51+
.btn-table{
52+
padding: 0.05rem 0.40rem !important;
53+
margin-left: 4%;
54+
margin-right: 4%;
55+
}
56+
57+
.icon{
58+
font-size: 19px;
59+
}

src/main/resources/static/index.js

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,14 @@ function createRow(employee) {
2424
employee.name,
2525
employee.job,
2626
employee.salary,
27-
"<button type='button' class='btn btn-light' data-toggle='modal' data-target='#modal' onclick='editEmployee(" + employee.id + ")'>Modificar</button>" +
28-
"<button type='button' class='btn btn-danger' onclick='deleteEmployee(" + employee.id + ")'>Eliminar</button>"
27+
//Edit button with Icon
28+
"<a role='button' class='btn btn-light btn-table' data-toggle='modal' data-target='#modal' "+
29+
"onclick='editEmployee(" + employee.id + ")'>"+
30+
"<i class='bi bi-pencil-square icon'></i></a>" +
31+
//Delete button with Icon
32+
"<a role='button' type='button' class='btn btn-danger btn-table'"+
33+
"onclick='deleteEmployee(" + employee.id + ")'>"+
34+
"<i class='bi bi-person-dash-fill icon' style='color:white'></i></a>"
2935
];
3036
}
3137

src/main/resources/templates/index.html

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@
1515
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
1616
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
1717
crossorigin="anonymous"></script>
18+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.0/font/bootstrap-icons.css">
1819

1920
<!-- Boostrap custom colors -->
2021
<link rel="stylesheet" type="text/css" href="custom_bootstrap.min.css">
@@ -45,18 +46,19 @@ <h6>Exercici realitzat utilitzant: Spring Api Rest, Javascript, jquery i Bootstr
4546
</div>
4647
<div class="col-sm-2 my-auto">
4748
<button type="button" class="btn btn-primary add" data-toggle="modal" data-target="#modal" onclick="newEmployee();">
49+
<i class="bi bi-person-plus-fill icon" style="margin-right: 5px;"></i>
4850
Nou Empleat</button>
4951
</div>
5052
</div>
5153
<div class="col-sm-12 tableBody">
52-
<table id="employeeTable" class="table table-bordered table-hover table-striped">
54+
<table id="employeeTable" class="table table-hover table-striped">
5355
<thead>
5456
<tr>
55-
<th style="width:3%" >#</th>
56-
<th style="width:25%">Nom</th>
57-
<th style="width:25%">Càrreg</th>
58-
<th style="width:25%">Salari</th>
59-
<th style="width:22%">Accions</th>
57+
<th style="width:4%" >#</th>
58+
<th style="width:28%">Nom</th>
59+
<th style="width:28%">Càrreg</th>
60+
<th style="width:28%">Salari</th>
61+
<th style="width:12%">Accions</th>
6062
</tr>
6163
</thead>
6264
<tbody>

0 commit comments

Comments
 (0)