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:
parent
f9b112d098
commit
bb1128cc03
@ -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' => ''];
|
||||
|
||||
|
@ -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>
|
||||
|
@ -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 {
|
||||
|
@ -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 {
|
||||
|
@ -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) => {
|
||||
|
@ -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; }
|
||||
|
@ -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;
|
||||
|
@ -80,8 +80,8 @@
|
||||
}
|
||||
|
||||
.company-logo {
|
||||
max-width: 65%;
|
||||
/* max-width: $company_logo_size;*/
|
||||
/* max-width: 65%;*/
|
||||
max-width: $company_logo_size;
|
||||
}
|
||||
|
||||
.entity-label {
|
||||
|
@ -84,8 +84,8 @@
|
||||
}
|
||||
|
||||
.company-logo {
|
||||
max-width: 55%;
|
||||
/* max-width: $company_logo_size;*/
|
||||
/* max-width: 55%;*/
|
||||
max-width: $company_logo_size;
|
||||
}
|
||||
|
||||
#client-details {
|
||||
|
@ -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);
|
||||
|
@ -62,8 +62,8 @@
|
||||
}
|
||||
|
||||
.company-logo {
|
||||
max-width: 65%;
|
||||
/* max-width: $company_logo_size;*/
|
||||
/* max-width: 65%;*/
|
||||
max-width: $company_logo_size;
|
||||
}
|
||||
|
||||
.contacts-wrapper {
|
||||
|
@ -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 {
|
||||
|
Loading…
Reference in New Issue
Block a user