Fix display ordini

This commit is contained in:
Samuele Locatelli
2023-05-23 11:41:34 +02:00
parent 8e2ea5c312
commit a4e62dc681
4 changed files with 53 additions and 51 deletions
+28 -40
View File
@@ -7,7 +7,7 @@
{
<div class="cardOrders01">
<div class="row mb-3">
<div class="fw-bold fs-2 text-start col-4">
<div class="fw-bold fs-2 text-start col-4 text-nowrap">
ORDER LIST
</div>
<div class="d-flex justify-content-between col-8">
@@ -31,37 +31,31 @@
<div class="d-flex justify-content-around">
<div class="cardOrders01 wRed01">
<div class="d-flex justify-content-between flex-nowrap align-items-center mb-3" style="--bgStepColor: @stepColor">
<div class="fw-bold fs-2 text-start">
<div class="fw-bold fs-3 text-start text-nowrap">
ORDER LIST
</div>
<div class=" px-3 d-flex justify-content-between small" style="font-size: 0.6rem">
<div>Order Date:</div>
<div>&nbsp;</div>
<div class=" fw-bold">@ord2Show.DateIns</div>
<div class=" px-2 small" style="font-size: 0.6rem">
<div class="small">Order Date:</div>
<div class="fw-bold">@ord2Show.DateIns</div>
</div>
<div class=" px-3 d-flex justify-content-between small" style="font-size: 0.6rem">
<div>Order Number:</div>
<div>&nbsp;</div>
<div class=" px-2 small" style="font-size: 0.6rem">
<div class="small">Order Number:</div>
<div class="fw-bold">@ord2Show.OrderExtCode</div>
</div>
<div class=" px-3 d-flex justify-content-between small">
<div>Order Description:</div>
<div>&nbsp;</div>
<div class=" px-2 small text-truncate">
<div class="small">Order Description:</div>
<div class="fw-bold">@ord2Show.OrderDescript</div>
</div>
<div class=" px-3 d-flex justify-content-between small" style="font-size: 0.6rem">
<div>Models Number:</div>
<div>&nbsp;</div>
<div class=" px-2 small" style="font-size: 0.6rem">
<div class="small">Models #:</div>
<div class="fw-bold">@ord2Show.NumType</div>
</div>
<div class=" px-3 d-flex justify-content-between small" style="font-size: 0.6rem">
<div class="text-center">Quantity:</div>
<div>&nbsp;</div>
<div class=" px-2 small" style="font-size: 0.6rem">
<div class="text-center">Quantity #:</div>
<div class="fw-bold">@ord2Show.NumDoors</div>
</div>
<div class=" px-3 d-flex justify-content-between small">
<div class=" px-2 small">
<div class="text-center">TOTAL COST:</div>
<div>&nbsp;</div>
<div class="fw-bold">@($"{ord2Show.TotCost:C2}")</div>
</div>
<div class="d-flex justify-content-between">
@@ -84,37 +78,31 @@
{
<div class="cardOrders01 wRed02">
<div class="d-flex justify-content-between flex-nowrap align-items-center mb-3">
<div class="fw-bold fs-2 text-start">
<div class="fw-bold fs-4 text-start text-nowrap">
ORDER LIST
</div>
<div class=" px-3 d-flex justify-content-between small">
<div>Order Date:</div>
<div>&nbsp;</div>
<div class=" fw-bold">@ord2Show.DateIns</div>
<div class=" px-2 small" style="font-size: 0.6rem">
<div class="small">Order Date:</div>
<div class="fw-bold">@ord2Show.DateIns</div>
</div>
<div class=" px-3 d-flex justify-content-between small">
<div>Order Number:</div>
<div>&nbsp;</div>
<div class=" px-2 small" style="font-size: 0.6rem">
<div class="small">Order Number:</div>
<div class="fw-bold">@ord2Show.OrderExtCode</div>
</div>
<div class=" px-3 d-flex justify-content-between small">
<div>Order Description:</div>
<div>&nbsp;</div>
<div class=" px-2 small text-truncate">
<div class="small">Order Description:</div>
<div class="fw-bold">@ord2Show.OrderDescript</div>
</div>
<div class=" px-3 d-flex justify-content-between small">
<div>Models Number:</div>
<div>&nbsp;</div>
<div class=" px-2 small" style="font-size: 0.6rem">
<div class="small">Models #:</div>
<div class="fw-bold">@ord2Show.NumType</div>
</div>
<div class=" px-3 d-flex justify-content-between small">
<div class="text-center">Quantity:</div>
<div>&nbsp;</div>
<div class=" px-2 small" style="font-size: 0.6rem">
<div class="text-center">Quantity #:</div>
<div class="fw-bold">@ord2Show.NumDoors</div>
</div>
<div class=" px-3 d-flex justify-content-between small">
<div class=" px-2 small">
<div class="text-center">TOTAL COST:</div>
<div>&nbsp;</div>
<div class="fw-bold">@($"{ord2Show.TotCost:C2}")</div>
</div>
<div class="d-flex justify-content-between">
@@ -130,7 +118,7 @@
<div class="d-flex justify-content-around">
<div class="cardOrders02 wRed01">
<div class="d-flex justify-content-between flex-nowrap align-items-center mb-3">
<div class="fw-bold fs-2 text-start">
<div class="fw-bold fs-3 text-start text-nowrap">
DOORS LIST
</div>
<div class=" px-3 d-flex justify-content-between small">
@@ -1,43 +1,51 @@
.cardOrders {
width: 100%;
border-radius: 18px;
padding: 1rem 4rem 0.5rem 4rem;
/*border-radius: 18px;*/
border-radius: 1.3rem;
padding: 1rem 2.5rem 0.5rem 2.5rem;
box-shadow: rgba(0, 0, 0, 0.45) 0px 20px 22px 3px;
margin-top: 0.5rem;
margin-bottom: 1rem;
position: relative;
font-size: 1rem;
}
.cardOrders01 {
width: 100%;
border-radius: 18px;
padding: 1rem 4rem 0.5rem 4rem;
/*border-radius: 18px;*/
border-radius: 1.3rem;
padding: 1rem 2.5rem 0.5rem 2.5rem;
box-shadow: rgba(0, 0, 0, 0.45) 0px 20px 22px 3px;
margin-top: 0.5rem;
margin-bottom: 1rem;
position: relative;
font-size: 1rem;
background-color: #FFFFFF;
color: #000;
z-index: 10;
}
.cardOrders02 {
width: 100%;
border-radius: 18px;
padding: 1rem 4rem 0.5rem 4rem;
/*border-radius: 18px;*/
border-radius: 1.3rem;
padding: 1rem 2.5rem 0.5rem 2.5rem;
box-shadow: rgba(0, 0, 0, 0.45) 0px 20px 22px 3px;
margin-top: 0.5rem;
margin-bottom: 1rem;
position: relative;
font-size: 1rem;
background-color: #FFFFFF;
z-index: 20;
}
.cardOrders03 {
width: 100%;
border-radius: 18px;
padding: 1rem 4rem 0.5rem 4rem;
/*border-radius: 18px;*/
border-radius: 1.3rem;
padding: 1rem 2.5rem 0.5rem 2.5rem;
box-shadow: rgba(0, 0, 0, 0.45) 0px 20px 22px 3px;
margin-top: 0.5rem;
margin-bottom: 1rem;
position: relative;
font-size: 1rem;
background-color: #FFFFFF;
z-index: 30;
}
@@ -48,6 +56,7 @@
color: #FFF;
animation-name: shrink01;
animation-duration: 0.6s;
font-size: 0.9rem;
}
.wRed02 {
width: 90%;
@@ -56,6 +65,7 @@
color: white;
animation-name: shrink02;
animation-duration: 0.6s;
font-size: 0.8rem;
}
@keyframes shrink01 {
0% {
@@ -6,12 +6,14 @@
.cardOrders {
width: @w01;
border-radius: 18px;
padding: 1rem 4rem 0.5rem 4rem;
/*border-radius: 18px;*/
border-radius: 1.3rem;
padding: 1rem 2.5rem 0.5rem 2.5rem;
box-shadow: rgba(0, 0, 0, 0.45) 0px 20px 22px 3px;
margin-top: 0.5rem;
margin-bottom: 1rem;
position: relative;
font-size: 1rem;
}
.cardOrders01 {
@@ -41,6 +43,7 @@
color: #FFF;
animation-name: shrink01;
animation-duration: @animTime;
font-size: 0.9rem;
}
.wRed02 {
@@ -50,6 +53,7 @@
color: white;
animation-name: shrink02;
animation-duration: @animTime;
font-size: 0.8rem;
}
@keyframes shrink01 {
+1 -1
View File
@@ -1 +1 @@
.cardOrders{width:100%;border-radius:18px;padding:1rem 4rem .5rem 4rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;}.cardOrders01{width:100%;border-radius:18px;padding:1rem 4rem .5rem 4rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;background-color:#fff;color:#000;z-index:10;}.cardOrders02{width:100%;border-radius:18px;padding:1rem 4rem .5rem 4rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;background-color:#fff;z-index:20;}.cardOrders03{width:100%;border-radius:18px;padding:1rem 4rem .5rem 4rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;background-color:#fff;z-index:30;}.wRed01{width:95%;margin-bottom:-1.5rem;background-color:#696969;color:#fff;animation-name:shrink01;animation-duration:.6s;}.wRed02{width:90%;margin-bottom:-1.5rem;background-color:#333;color:#fff;animation-name:shrink02;animation-duration:.6s;}@keyframes shrink01{0%{width:100%;background-color:#fff;color:#000;}80%{width:95%;background-color:#696969;color:#000;}100%{width:95%;color:#fff;}}@keyframes shrink02{0%{width:95%;background-color:#696969;}80%{width:90%;background-color:#333;}100%{width:90%;}}
.cardOrders{width:100%;border-radius:1.3rem;padding:1rem 2.5rem .5rem 2.5rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;font-size:1rem;}.cardOrders01{width:100%;border-radius:1.3rem;padding:1rem 2.5rem .5rem 2.5rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;font-size:1rem;background-color:#fff;color:#000;z-index:10;}.cardOrders02{width:100%;border-radius:1.3rem;padding:1rem 2.5rem .5rem 2.5rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;font-size:1rem;background-color:#fff;z-index:20;}.cardOrders03{width:100%;border-radius:1.3rem;padding:1rem 2.5rem .5rem 2.5rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;font-size:1rem;background-color:#fff;z-index:30;}.wRed01{width:95%;margin-bottom:-1.5rem;background-color:#696969;color:#fff;animation-name:shrink01;animation-duration:.6s;font-size:.9rem;}.wRed02{width:90%;margin-bottom:-1.5rem;background-color:#333;color:#fff;animation-name:shrink02;animation-duration:.6s;font-size:.8rem;}@keyframes shrink01{0%{width:100%;background-color:#fff;color:#000;}80%{width:95%;background-color:#696969;color:#000;}100%{width:95%;color:#fff;}}@keyframes shrink02{0%{width:95%;background-color:#696969;}80%{width:90%;background-color:#333;}100%{width:90%;}}