1
0
mirror of https://github.com/invoiceninja/invoiceninja.git synced 2024-11-12 22:22:32 +01:00

applying variables into designs

This commit is contained in:
David Bomba 2023-02-02 07:06:23 +11:00
parent f9b112d098
commit bb1128cc03
12 changed files with 59 additions and 35 deletions

View File

@ -118,6 +118,7 @@ class HtmlEngine
$data['$global_margin'] = ['value' => '6.35mm', 'label' => ''];
$data['$company_logo_size'] = ['value' => $this->resolveCompanyLogoSize(), 'label' => ''];
$data['show_shipping_address'] = ['value' => $this->settings?->show_shipping_address ? 'flex' : 'none', 'label' => ''];
$data['$tax'] = ['value' => '', 'label' => ctrans('texts.tax')];
$data['$app_url'] = ['value' => $this->generateAppUrl(), 'label' => ''];
$data['$from'] = ['value' => '', 'label' => ctrans('texts.from')];
@ -182,7 +183,7 @@ class HtmlEngine
$data['$invoice.project'] = &$data['$project.name'];
}
if($this->entity->status_id == 4) {
if($this->entity->status_id == 4 && $this->settings->show_paid_stamp) {
$data['$status_logo'] = ['value' => '<div class="stamp is-paid"> ' . ctrans('texts.paid') .'</div>', 'label' => ''];
}
@ -568,7 +569,7 @@ class HtmlEngine
$data['_rate2'] = ['value' => '', 'label' => ctrans('texts.tax')];
$data['_rate3'] = ['value' => '', 'label' => ctrans('texts.tax')];
$data['$font_size'] = ['value' => $this->settings->font_size . 'px', 'label' => ''];
$data['$font_size'] = ['value' => $this->settings->font_size . 'px !important;', 'label' => ''];
$data['$font_name'] = ['value' => Helpers::resolveFont($this->settings->primary_font)['name'], 'label' => ''];
$data['$font_url'] = ['value' => Helpers::resolveFont($this->settings->primary_font)['url'], 'label' => ''];

View File

@ -11,10 +11,14 @@
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: $font_name, Helvetica, sans-serif;
font-size: "$font_size";
font-size: $font_size
zoom: 80%;
}
/*
body, table{
font-size: $font_size
}
*/
body, html {
margin: 0;
padding: 0;
@ -57,9 +61,9 @@
margin-bottom: 1rem;
}
.company-logo {
height: 100%;
max-width: 100%;
/* max-width: $company_logo_size;*/
/* height: 100%;*/
/* max-width: 100%;*/
max-width: $company_logo_size;
object-fit: contain;
object-position: left center;
}
@ -77,10 +81,17 @@
}
#client-details {
margin: 2rem;
padding-right:1rem;
display: flex;
flex-direction: column;
line-height: var(--line-height);
padding-left: 2rem;
}
#shipping-details {
display: $show_shipping_address;
flex-direction: column;
line-height: var(--line-height);
}
#client-details > :first-child {
@ -89,9 +100,13 @@
.client-entity-wrapper {
display: grid;
grid-template-columns: 1.5fr 1fr;
grid-template-columns: 2fr 1fr;
padding-left: 1rem;
}
.client-wrapper-left-side {
display: flex;
}
.entity-details-wrapper {
background-color: var(--primary-color);
@ -114,7 +129,7 @@
min-width: 100%;
table-layout: fixed;
overflow-wrap: break-word;
margin-top: 3rem;
margin-top: 1rem;
margin-bottom: 0px;
}
@ -388,9 +403,15 @@
<td>
<div class="client-entity-wrapper">
<div class="client-wrapper-left-side">
<h4 class="entity-label">$entity_label</h4>
<div id="client-details" cellspacing="0"></div>
<div id="vendor-details" cellspacing="0"></div>
<div>
<h4 class="entity-label" style="margin-top:0px; margin-bottom:10px;">$entity_label</h4>
<div id="client-details" cellspacing="0"></div>
<div id="vendor-details" cellspacing="0"></div>
</div>
<div>
<h4 class="entity-label" style="opacity: 0; margin-top:0px; margin-bottom:10px;">&</h4>
<div id="shipping-details" cellspacing="0"></div>
</div>
</div>
<div class="entity-details-wrapper-right-side">
@ -414,7 +435,7 @@
<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>
</td>
</tr>
</tbody>

View File

@ -40,8 +40,8 @@
}
.company-logo {
max-width: 65%;
/* max-width: $company_logo_size;*/
/* max-width: 65%;*/
max-width: $company_logo_size;
}
.header-container > span {

View File

@ -46,8 +46,8 @@
}
.company-logo {
max-width: 65%;
/* max-width: $company_logo_size;*/
/* max-width: 65%;*/
max-width: $company_logo_size;
}
.client-and-entity-wrapper {

View File

@ -113,7 +113,7 @@
}
#shipping-details {
display: flex;
display: $show_shipping_address;
flex-direction: column;
line-height: var(--line-height);
}
@ -290,6 +290,8 @@
z-index:200 !important;
position: fixed;
text-align: center;
float:right;
}
.is-paid {
@ -387,7 +389,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>
</td>
</tr>
@ -416,7 +418,7 @@ $entity_images
'product-table', 'task-table', 'delivery-note-table',
'statement-invoice-table', 'statement-payment-table', 'statement-aging-table-totals',
'statement-invoice-table-totals', 'statement-payment-table-totals', 'statement-aging-table',
'client-details','vendor-details', 'swiss-qr'
'client-details','vendor-details', 'swiss-qr','shipping-details'
];
tables.forEach((tableIdentifier) => {

View File

@ -41,8 +41,8 @@
}
.company-logo {
max-width: 65%;
/* max-width: $company_logo_size;*/
/* max-width: 65%;*/
max-width: $company_logo_size;
}
#entity-details p { margin-top: 5px; }

View File

@ -31,8 +31,8 @@
}
.company-logo {
max-width: 55%;
/* max-width: $company_logo_size;*/
/* max-width: 55%;*/
max-width: $company_logo_size;
margin-left: auto;
margin-right: auto;
display: block;

View File

@ -80,8 +80,8 @@
}
.company-logo {
max-width: 65%;
/* max-width: $company_logo_size;*/
/* max-width: 65%;*/
max-width: $company_logo_size;
}
.entity-label {

View File

@ -84,8 +84,8 @@
}
.company-logo {
max-width: 55%;
/* max-width: $company_logo_size;*/
/* max-width: 55%;*/
max-width: $company_logo_size;
}
#client-details {

View File

@ -43,7 +43,7 @@
.company-logo {
/* max-width: 65%;*/
max-width: $company_logo_size;
max-width: $company_logo_size;
}
.header-wrapper #company-address {
@ -93,7 +93,7 @@
}
#shipping-details {
display: flex;
display: $show_shipping_address;
flex-direction: column;
padding-right: 30px;
line-height: var(--line-height);

View File

@ -62,8 +62,8 @@
}
.company-logo {
max-width: 65%;
/* max-width: $company_logo_size;*/
/* max-width: 65%;*/
max-width: $company_logo_size;
}
.contacts-wrapper {

View File

@ -67,8 +67,8 @@
}
.company-logo {
max-width: 65%;
/* max-width: $company_logo_size;*/
/* max-width: 65%;*/
max-width: $company_logo_size;
}
.header-invoice-number {