This commit is contained in:
Samuele Locatelli
2023-01-13 14:34:20 +01:00
7 changed files with 125 additions and 65 deletions
@@ -62,4 +62,8 @@
box-shadow: 0px 0px 20px 5px rgba(0, 128, 255, 0.8);
color: #ffffff;
}
}
.txtSec {
font-weight: normal;
font-size: 2rem;
}
@@ -75,4 +75,9 @@
box-shadow: 0px 0px 20px 5px rgba(0, 128, 255, .8);
color: rgba(255, 255, 255, 1);
}
}
.txtSec{
font-weight: normal;
font-size: 2rem;
}
+1 -1
View File
@@ -1 +1 @@
.cardContainer{min-height:8.5rem;border-radius:12px;width:100%;box-shadow:0 3px 4px rgba(0,0,0,.7);color:#fff;}.data{font-weight:bold;padding-top:1.5rem;padding-left:1.5rem;position:relative;font-size:1.25rem;text-transform:uppercase;}.ora{width:100%;font-weight:bold;position:relative;font-size:3.5rem;text-align:center;}.defaultRedCard{background-color:#e74c3c;}.cardEntrata{background-color:#9b59b6;}.cardUscita{background-color:#4caf50;}.pulse-warning{box-shadow:0 0 20px 5px rgba(0,128,255,.8);animation:pulse-warning 2.5s infinite;}@-webkit-keyframes pulse-warning{0%{-webkit-box-shadow:0 0 20px 5px rgba(0,128,255,.8);color:#fff;}70%{-webkit-box-shadow:0 0 20px 5px rgba(0,128,255,0);}100%{-webkit-box-shadow:0 0 20px 5px rgba(0,128,255,.8);color:#fff;}}@keyframes pulse-warning{0%{-moz-box-shadow:0 0 20px 5px rgba(0,128,255,.8);box-shadow:0 0 20px 5px rgba(0,128,255,.8);color:#fff;}70%{-moz-box-shadow:0 0 20px 5px rgba(0,128,255,0);box-shadow:0 0 20px 5px rgba(0,128,255,0);}100%{-moz-box-shadow:0 0 20px 5px rgba(255,170,0,.8);box-shadow:0 0 20px 5px rgba(0,128,255,.8);color:#fff;}}
.cardContainer{min-height:8.5rem;border-radius:12px;width:100%;box-shadow:0 3px 4px rgba(0,0,0,.7);color:#fff;}.data{font-weight:bold;padding-top:1.5rem;padding-left:1.5rem;position:relative;font-size:1.25rem;text-transform:uppercase;}.ora{width:100%;font-weight:bold;position:relative;font-size:3.5rem;text-align:center;}.defaultRedCard{background-color:#e74c3c;}.cardEntrata{background-color:#9b59b6;}.cardUscita{background-color:#4caf50;}.pulse-warning{box-shadow:0 0 20px 5px rgba(0,128,255,.8);animation:pulse-warning 2.5s infinite;}@-webkit-keyframes pulse-warning{0%{-webkit-box-shadow:0 0 20px 5px rgba(0,128,255,.8);color:#fff;}70%{-webkit-box-shadow:0 0 20px 5px rgba(0,128,255,0);}100%{-webkit-box-shadow:0 0 20px 5px rgba(0,128,255,.8);color:#fff;}}@keyframes pulse-warning{0%{-moz-box-shadow:0 0 20px 5px rgba(0,128,255,.8);box-shadow:0 0 20px 5px rgba(0,128,255,.8);color:#fff;}70%{-moz-box-shadow:0 0 20px 5px rgba(0,128,255,0);box-shadow:0 0 20px 5px rgba(0,128,255,0);}100%{-moz-box-shadow:0 0 20px 5px rgba(255,170,0,.8);box-shadow:0 0 20px 5px rgba(0,128,255,.8);color:#fff;}}.txtSec{font-weight:normal;font-size:2rem;}
+59 -52
View File
@@ -1,62 +1,69 @@
<div class="container">
<div class="timbMancContainer">
<div class="timbMancCard">
<div class="header">
Richiesta mancata timbratura
</div>
<div class="timbManc small">
<div class="text-center">
<input type="time" />
</div>
<div class="d-flex justify-content-between p-2">
<button class="btnEntr">Entrata</button>
<button class="btnEsc">Uscita</button>
<div class="timbMancContainer">
<div class="timbManc small">
<div class="text-center">
<input type="time" />
</div>
<div class="d-flex justify-content-between p-2">
<button class="btnEntr">Entrata</button>
<button class="btnEsc">Uscita</button>
</div>
</div>
</div>
</div>
<div class="timbApp small">
<table>
<thead class="border-1">
<tr>
<th class="p-1 text-center">
<i class="fa-regular fa-clock"></i>
</th>
<th class="p-1 text-center">
<i class="fa-solid fa-right-to-bracket"></i>
</th>
<th class="p-1 text-center">
Scambio
</th>
<th class="p-1 text-center">
<i class="fa-solid fa-right-from-bracket"></i>
</th>
<th class="p-1 text-center">
</th>
</tr>
</thead>
<tbody>
<tr class="text-center">
<td class="p-1 text-center">
18:36
</td>
<td class="p-1 text-center">
</td>
<td class="p-1 text-center">
<button>
<i class="fa-solid fa-arrow-right-arrow-left"></i>
</button>
</td>
<td class="p-1 text-center">
X
</td>
<td class="p-1 text-center">
<button class="btn btn-sm btn-danger"><i class="fa-solid fa-trash-can"></i></button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="timbAppCard">
<div class="header">
Richiesta mancata timbratura
</div>
<div class="timbApp small">
<table>
<thead class="border-1">
<tr>
<th class="p-1 text-center">
<i class="fa-regular fa-clock"></i>
</th>
<th class="p-1 text-center">
<i class="fa-solid fa-right-to-bracket"></i>
</th>
<th class="p-1 text-center">
Scambio
</th>
<th class="p-1 text-center">
<i class="fa-solid fa-right-from-bracket"></i>
</th>
<th class="p-1 text-center">
</th>
</tr>
</thead>
<tbody>
<tr class="text-center">
<td class="p-1 text-center">
18:36
</td>
<td class="p-1 text-center">
<i class="fa-regular fa-square"></i>
</td>
<td class="p-1 text-center">
<button>
<i class="fa-solid fa-arrow-right-arrow-left"></i>
</button>
</td>
<td class="p-1 text-center">
<i class="fa-regular fa-square-check text-success"></i>
</td>
<td class="p-1 text-center">
<button class="btn btn-sm btn-danger"><i class="fa-solid fa-trash-can"></i></button>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
@@ -7,7 +7,7 @@
}
.timbApp {
border-radius: 0.8rem;
background-color: #F1C40F;
background-color: transparent;
width: 100%;
height: 100%;
}
@@ -15,12 +15,12 @@
width: 100%;
height: 100%;
}
.timbApp table thead {
border-bottom: 1px solid black;
}
/*.timbApp table thead{
border-bottom: 1px solid black;
}*/
.timbManc {
border-radius: 0.8rem;
background-color: #F1C40F;
background-color: transparent;
padding: 0.5rem;
width: 70%;
height: 100%;
@@ -37,4 +37,27 @@
border-radius: 0.5rem;
border: none;
padding: 0.25rem;
}
.timbMancCard .header {
text-align: center;
border-bottom: 1px solid black;
padding-top: 0.3rem;
padding-bottom: 0.3rem;
color: #fff;
}
.timbMancCard {
border-radius: 0.8rem;
background-color: #0d8b23;
}
.timbAppCard .header {
text-align: center;
border-bottom: 1px solid black;
padding-top: 0.3rem;
padding-bottom: 0.3rem;
color: #fff;
}
.timbAppCard {
margin-top: 2rem;
border-radius: 0.8rem;
background-color: #ff8b23;
}
@@ -8,10 +8,9 @@
.timbApp {
border-radius: 0.8rem;
background-color: #F1C40F;
background-color: transparent;
width: 100%;
height: 100%;
}
.timbApp table {
@@ -19,13 +18,13 @@
height: 100%;
}
.timbApp table thead{
/*.timbApp table thead{
border-bottom: 1px solid black;
}
}*/
.timbManc {
border-radius: 0.8rem;
background-color: #F1C40F;
background-color: transparent;
padding: 0.5rem;
width: 70%;
height: 100%;
@@ -45,7 +44,29 @@
border: none;
padding: 0.25rem;
}
.timbMancCard .header{
text-align: center;
border-bottom: 1px solid black;
padding-top: 0.3rem;
padding-bottom: 0.3rem;
color: #fff;
}
.btnEsc{
.timbMancCard{
border-radius: 0.8rem;
background-color: #0d8b23
}
.timbAppCard .header {
text-align: center;
border-bottom: 1px solid black;
padding-top: 0.3rem;
padding-bottom: 0.3rem;
color: #fff;
}
.timbAppCard {
margin-top: 2rem;
border-radius: 0.8rem;
background-color: #ff8b23
}
+1 -1
View File
@@ -1 +1 @@
.container{width:100%;height:100%;padding-left:.5rem;padding-right:.5rem;margin:0;}.timbApp{border-radius:.8rem;background-color:#f1c40f;width:100%;height:100%;}.timbApp table{width:100%;height:100%;}.timbApp table thead{border-bottom:1px solid #000;}.timbManc{border-radius:.8rem;background-color:#f1c40f;padding:.5rem;width:70%;height:100%;margin-bottom:.8rem;}.timbMancContainer{margin-top:.5rem;width:100%;height:100%;display:flex;justify-content:center;}.timbManc input{border-radius:.5rem;border:0;padding:.25rem;}
.container{width:100%;height:100%;padding-left:.5rem;padding-right:.5rem;margin:0;}.timbApp{border-radius:.8rem;background-color:transparent;width:100%;height:100%;}.timbApp table{width:100%;height:100%;}.timbManc{border-radius:.8rem;background-color:transparent;padding:.5rem;width:70%;height:100%;margin-bottom:.8rem;}.timbMancContainer{margin-top:.5rem;width:100%;height:100%;display:flex;justify-content:center;}.timbManc input{border-radius:.5rem;border:0;padding:.25rem;}.timbMancCard .header{text-align:center;border-bottom:1px solid #000;padding-top:.3rem;padding-bottom:.3rem;color:#fff;}.timbMancCard{border-radius:.8rem;background-color:#0d8b23;}.timbAppCard .header{text-align:center;border-bottom:1px solid #000;padding-top:.3rem;padding-bottom:.3rem;color:#fff;}.timbAppCard{margin-top:2rem;border-radius:.8rem;background-color:#ff8b23;}