Mirrors/invoiceninja
1
0
Fork 0
mirror of https://github.com/invoiceninja/invoiceninja.git synced 2024-11-10 13:12:50 +01:00
Code Issues Releases Activity

Show shipping address on Tech Design

Browse Source
This commit is contained in:
David Bomba 2023-02-22 15:32:51 +11:00
parent 0139fec85a
commit ac9532d1a1
1 changed files with 66 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

91
resources/views/pdf-designs/tech.html
View File

@ -43,31 +43,31 @@
/** End of global, standard CSS */
.header-wrapper {
display: flex;
flex-direction: column;
display: grid;
grid-template-columns: auto 1fr auto;
grid-template-areas: "a b c";
grid-auto-columns: minmax(0, 5fr);
grid-auto-flow: column;
justify-content: space-between;
}
.top-right-side-section {
display: flex;
flex-direction: row;
display: inline-block;
flex-direction: column;
justify-content: flex-end;
}
.top-right-side-section > * {
margin-left: 1.5rem;
white-space: nowrap;
vertical-align: top;
}
.logo-and-partial-entity-info {
display: flex;
flex-direction: row;
flex-direction: column;
justify-content: space-between;
align-items: center;
height: 120px;
/* align-items: center; */
/* height: 120px; */
}
.company-logo-wrapper {
padding-bottom: 60px;
height: 5rem;
}
.company-logo {
@ -89,7 +89,7 @@
}
.hero-section {
margin-top: 50px;
margin-top: 5px;
min-width: 100% !important;
background: url('$tech_hero_image'); /** If you want to replace the image, this is the place to do it. */
-webkit-background-size: cover;
@ -114,6 +114,10 @@
justify-items: start;
}
.spacer {
display: flex;
}
.client-details-to-label {
text-transform: uppercase;
font-weight: bold;
@ -121,11 +125,30 @@
margin-right: 10px;
}
.shipping-to-label {
text-transform: uppercase;
font-weight: bold;
color: var(--primary-color);
margin-right: 10px;
display: $show_shipping_address;
}
#shipping-details {
display: $show_shipping_address;
flex-direction: column;
white-space: nowrap;
}
[data-ref="shipping_address-label"] {
display: none;
}
#client-details,
#company-details,
#company-address {
display: flex;
flex-direction: column;
white-space: nowrap;
}
.company-details-wrapper {
@ -353,25 +376,31 @@
<td>
<div id="body">
<div class="header-wrapper">
<div class="top-right-side-section">
<span class="header-invoice-number">$entity_number_label: $entity_number</span>
<span>$date_label: $date</span>
</div>
<div class="logo-and-partial-entity-info">
<div class="company-logo-wrapper">
<img class="company-logo" src="$company.logo"
alt="$company.name logo">
<img class="company-logo" src="$company.logo" alt="$company.name logo">
</div>
</div>
<div class="spacer"></div>
<div class="top-right-side-section">
<div dir="$dir">
<span class="header-payment-due-label">$payment_due_label:</span>
<span>$payment_due</span>
</div>
<div dir="$dir">
<span class="header-amount-due-label">$amount_due_label:</span>
<span class="header-amount-due-value">$amount_due</span>
</div>
</div>
<table style="white-space: nowrap;" cellspacing="10">
<tr>
<td>$entity_number_label:</td>
<td class="header-invoice-number">$entity_number</td>
</tr>
<tr>
<td>$date_label:</td>
<td>$date</td>
</tr>
<tr class="header-payment-due-label">
<td>$payment_due_label:</td>
<td>$payment_due</td>
</tr>
<tr>
<td class="header-amount-due-label">$amount_due_label:</td>
<td class="header-amount-due-value">$amount_due</td>
</tr>
</table>
</div>
</div>
<div class="hero-section">
@ -380,6 +409,8 @@
<span class="client-details-to-label">$to_label:</span>
<div id="client-details"></div>
<div id="vendor-details"></div>
<span class="shipping-to-label">$shipping_label:</span>
<div id="shipping-details"></div>
</div>
<div class="company-details">
<span class="client-details-to-label">$from_label:</span>
@ -400,7 +431,7 @@
<div id="statement-payment-table-totals" data-ref="statement-totals"></div>
<table id="statement-aging-table" cellspacing="0" data-ref="table"></table>
<div id="statement-aging-table-totals" data-ref="statement-totals"></div>
<div id="table-totals" cellspacing="0"></div>
<div id="table-totals" cellspacing="0">$status_logo</div>
</div>
</div>
</td>