diff --git a/app/Services/PdfMaker/Design.php b/app/Services/PdfMaker/Design.php
index e530f7a3caf1..4af38a1442d9 100644
--- a/app/Services/PdfMaker/Design.php
+++ b/app/Services/PdfMaker/Design.php
@@ -433,7 +433,11 @@ class Design extends BaseDesign
['element' => 'span', 'content' => '$entity.terms_label: ', 'properties' => ['hidden' => $this->entityVariableCheck('$entity.terms'), 'data-ref' => 'total_table-terms-label', 'style' => 'font-weight: bold; text-align: left;']],
['element' => 'span', 'content' => '$entity.terms', 'properties' => ['data-ref' => 'total_table-terms', 'style' => 'text-align: left;']],
]],
+ ['element' => 'div', 'properties' => ['style' => 'margin-top: 1.5rem; display: flex; align-items: flex-start;'], 'elements' => [
+ ['element' => 'img', 'properties' => ['src' => '$invoiceninja.whitelabel', 'style' => 'height: 4rem;', 'hidden' => $this->entity->user->account->isPaid() ? 'true' : 'false', 'id' => 'invoiceninja-whitelabel-logo']],
+ ]],
]],
+ ['element' => 'div', 'properties' => ['class' => 'totals-table-right-side'], 'elements' => []],
];
foreach (['discount', 'custom_surcharge1', 'custom_surcharge2', 'custom_surcharge3', 'custom_surcharge4'] as $property) {
@@ -461,8 +465,7 @@ class Design extends BaseDesign
}
foreach ($taxes as $i => $tax) {
- $elements[] = ['element' => 'div', 'elements' => [
- ['element' => 'span', 'content' => 'This is placeholder for the 3rd fraction of element.', 'properties' => ['style' => 'opacity: 0%']], // Placeholder for fraction of element (3fr)
+ $elements[1]['elements'][] = ['element' => 'div', 'elements' => [
['element' => 'span', 'content', 'content' => $tax['name'], 'properties' => ['data-ref' => 'totals-table-total_tax_' . $i . '-label']],
['element' => 'span', 'content', 'content' => Number::formatMoney($tax['total'], $this->context['client']), 'properties' => ['data-ref' => 'totals-table-total_tax_' . $i]],
]];
@@ -475,15 +478,13 @@ class Design extends BaseDesign
}
foreach ($taxes as $i => $tax) {
- $elements[] = ['element' => 'div', 'elements' => [
- ['element' => 'span', 'content' => 'This is placeholder for the 3rd fraction of element.', 'properties' => ['style' => 'opacity: 0%']], // Placeholder for fraction of element (3fr)
+ $elements[1]['elements'][] = ['element' => 'div', 'elements' => [
['element' => 'span', 'content', 'content' => $tax['name'], 'properties' => ['data-ref' => 'totals-table-line_tax_' . $i . '-label']],
['element' => 'span', 'content', 'content' => Number::formatMoney($tax['total'], $this->context['client']), 'properties' => ['data-ref' => 'totals-table-line_tax_' . $i]],
]];
}
} else {
- $elements[] = ['element' => 'div', 'elements' => [
- ['element' => 'span', 'content' => 'This is placeholder for the 3rd fraction of element.', 'properties' => ['style' => 'opacity: 0%']], // Placeholder for fraction of element (3fr)
+ $elements[1]['elements'][] = ['element' => 'div', 'elements' => [
['element' => 'span', 'content' => $variable . '_label', 'properties' => ['data-ref' => 'totals_table-' . substr($variable, 1) . '-label']],
['element' => 'span', 'content' => $variable, 'properties' => ['data-ref' => 'totals_table-' . substr($variable, 1)]],
]];
@@ -491,13 +492,17 @@ class Design extends BaseDesign
}
if (!is_null($this->entity->partial) && $this->entity->partial > 0) {
- $elements[] = ['element' => 'div', 'elements' => [
- ['element' => 'span', 'content' => 'This is placeholder for the 3rd fraction of element.', 'properties' => ['style' => 'opacity: 0%']], // Placeholder for fraction of element (3fr)
+ $elements[1]['elements'][] = ['element' => 'div', 'elements' => [
['element' => 'span', 'content' => '$partial_due_label', 'properties' => ['data-ref' => 'totals_table-partial_due-label']],
['element' => 'span', 'content' => '$partial_due'],
]];
}
+ $elements[1]['elements'][] = ['element' => 'div', 'elements' => [
+ ['element' => 'span', 'content' => '',],
+ ['element' => 'span', 'content' => ''],
+ ]];
+
return $elements;
}
}
diff --git a/app/Services/PdfMaker/Designs/Utilities/DesignHelpers.php b/app/Services/PdfMaker/Designs/Utilities/DesignHelpers.php
index 53330d9b5bd8..5877f3804c1a 100644
--- a/app/Services/PdfMaker/Designs/Utilities/DesignHelpers.php
+++ b/app/Services/PdfMaker/Designs/Utilities/DesignHelpers.php
@@ -209,11 +209,9 @@ trait DesignHelpers
});
*/
-
$javascript = 'document.querySelectorAll("tbody > tr > td").forEach(t=>{if(""!==t.innerText){let e=t.getAttribute("data-ref").slice(0,-3);document.querySelector(`th[data-ref="${e}-th"]`).removeAttribute("hidden")}}),document.querySelectorAll("tbody > tr > td").forEach(t=>{let e=t.getAttribute("data-ref").slice(0,-3);(e=document.querySelector(`th[data-ref="${e}-th"]`)).hasAttribute("hidden")&&""==t.innerText&&t.setAttribute("hidden","true")});';
return ['element' => 'div', 'elements' => [
- ['element' => 'img', 'properties' => ['src' => '$invoiceninja.whitelabel', 'style' => 'height: 3rem; position: fixed; bottom: 0; left: 0; padding: 5px; margin: 5px;', 'hidden' => $this->entity->user->account->isPaid() ? 'true' : 'false', 'id' => 'invoiceninja-whitelabel-logo']],
['element' => 'script', 'content' => $javascript],
]];
}
diff --git a/app/Utils/HtmlEngine.php b/app/Utils/HtmlEngine.php
index fdf8e0eeaa04..4626f76e270f 100644
--- a/app/Utils/HtmlEngine.php
+++ b/app/Utils/HtmlEngine.php
@@ -341,7 +341,7 @@ class HtmlEngine
$data['$font_size'] = ['value' => $this->settings->font_size . 'px', 'label' => ''];
- $data['$invoiceninja.whitelabel'] = ['value' => asset('images/created-by-invoiceninja-new.png'), 'label' => ''];
+ $data['$invoiceninja.whitelabel'] = ['value' => 'https://raw.githubusercontent.com/invoiceninja/invoiceninja/v5-develop/public/images/created-by-invoiceninja-new.png', 'label' => ''];
$data['$primary_color'] = ['value' => $this->settings->primary_color, 'label' => ''];
$data['$secondary_color'] = ['value' => $this->settings->secondary_color, 'label' => ''];
diff --git a/database/migrations/2021_01_19_115919_update_designs.php b/database/migrations/2021_02_10_115919_update_designs.php
similarity index 100%
rename from database/migrations/2021_01_19_115919_update_designs.php
rename to database/migrations/2021_02_10_115919_update_designs.php
diff --git a/resources/views/pdf-designs/bold.html b/resources/views/pdf-designs/bold.html
index ea1b23ae6d0d..c45aed83da0c 100644
--- a/resources/views/pdf-designs/bold.html
+++ b/resources/views/pdf-designs/bold.html
@@ -9,6 +9,7 @@
-moz-osx-font-smoothing: grayscale;
font-family: Arial, Helvetica, sans-serif;
font-size: "$font_size";
+ zoom: 80%;
}
@page {
@@ -27,13 +28,11 @@
background-color: #2d2c2a;
padding: 3rem;
color: white;
+ min-width: 100%;
}
.company-logo {
height: 6rem;
- padding: 2rem;
- background-color: white;
- margin: -4rem 2rem 2rem;
}
#company-details,
@@ -55,6 +54,8 @@
.client-entity-wrapper {
display: grid;
grid-template-columns: 1.5fr 1fr;
+ padding-left: 1rem;
+ padding-top: 3rem;
}
.entity-details-wrapper {
@@ -99,8 +100,8 @@
#product-table > thead > tr > th,
#delivery-note-table > thead > tr > th,
#task-table > thead > tr > th {
- padding: 1.5rem;
- font-size: 1.5rem;
+ padding: 1.5rem 3rem;
+ font-size: 1rem;
}
#product-table > thead > tr > th:last-child,
@@ -112,7 +113,7 @@
#product-table > tbody > tr > td,
#delivery-note-table > tbody > tr > td,
#task-table > tbody > tr > td {
- padding: 1.5rem;
+ padding: 1.5rem 3rem;
}
#product-table > tbody > tr > td:last-child,
@@ -137,12 +138,26 @@
page-break-inside: avoid;
}
- #table-totals > * {
+ #table-totals {
display: grid;
- grid-template-columns: 3fr 1fr 1fr;
+ grid-template-columns: 2fr 1fr;
padding-top: .5rem;
- padding-left: 1.2rem;
- gap: 20px;
+ padding-left: 3rem;
+ padding-right: 3rem;
+ gap: 80px;
+ }
+
+ #table-totals .totals-table-right-side>* {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(1) {
+ text-align: left;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(2) {
+ text-align: right;
}
#table-totals
@@ -165,38 +180,90 @@
text-align: right;
padding-right: 1.5rem;
}
+
+ .entity-label {
+ text-transform: uppercase;
+ color: var(--primary-color);
+ padding-left: 2rem;
+ font-size: 1.5rem;
+ }
+
+ table.page-container {
+ page-break-after: always;
+ min-width: 100%;
+ }
+
+ thead.page-header {
+ display: table-header-group;
+ }
+
+ tfoot.page-footer {
+ display: table-footer-group;
+ }
+
+ .footer-wrapper {
+ margin-top: 1rem;
+ background-color: #2d2c2a;
+ height: 160px;
+ min-width: 100%;
+ position: fixed;
+ bottom: 0;
+ padding: 1rem 3rem;
+ display: grid;
+ grid-template-columns: 1fr 1fr 1fr;
+ gap: 15px;
+ }
+
+
-
+
+
+
+
+
-
- 
+
+
-
+
-
+
-
-
-
-
-
-
-
-
+
+ |
+
+
+
diff --git a/resources/views/pdf-designs/business.html b/resources/views/pdf-designs/business.html
index d7194536be62..427a77b8f8c8 100644
--- a/resources/views/pdf-designs/business.html
+++ b/resources/views/pdf-designs/business.html
@@ -9,6 +9,7 @@
-moz-osx-font-smoothing: grayscale;
font-family: Arial, Helvetica, sans-serif;
font-size: "$font_size";
+ zoom: 80%;
}
@page {
@@ -37,7 +38,7 @@
#company-details {
display: flex;
flex-direction: column;
- color: #b1b1b1;
+ color: #AAA9A9;
}
#company-details > * {
@@ -68,20 +69,20 @@
#client-details {
display: flex;
flex-direction: column;
- color: var(--primary-color);
+ margin-top: 1rem;
}
#client-details > * {
margin-bottom: 0.5rem;
}
- #client-details > span:nth-child(1) {
- font-weight: bold;
+ #client-details > p:nth-child(1) {
+ color: var(--primary-color);
}
#entity-details {
background-color: var(--primary-color);
- padding: 0.8rem;
+ padding: 1.2rem;
border-radius: 1rem;
width: 100%;
color: white;
@@ -90,6 +91,11 @@
#entity-details th {
font-weight: normal;
+ padding-bottom: .5rem;
+ }
+
+ #entity-details > tbody > tr > th:nth-child(2) {
+ text-align: right;
}
#product-table,
@@ -151,7 +157,7 @@
#product-table > tbody > tr:nth-child(odd) > td,
#delivery-note-table > tbody > tr:nth-child(odd) > td,
#task-table > tbody > tr:nth-child(odd) > td {
- background: #e8e8e8;
+ background: #F7F7F7;
}
#product-table > tbody > tr:nth-child(even) > td,
@@ -177,16 +183,28 @@
border-bottom-right-radius: 1rem;
}
- #table-totals > * {
- background-color: #f7f7f7;
+ #table-totals {
display: grid;
- grid-template-columns: 3fr 1fr 1fr;
- gap: 20px;
+ grid-template-columns: 2fr 1fr;
+ gap: 80px;
padding-left: 1rem;
padding-top: 0.5rem;
padding-bottom: 0.8rem;
}
+ #table-totals .totals-table-right-side>* {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(1) {
+ text-align: left;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(2) {
+ text-align: right;
+ }
+
#table-totals
> *
[data-element='product-table-balance-due-label'],
diff --git a/resources/views/pdf-designs/clean.html b/resources/views/pdf-designs/clean.html
index 159957acdb9e..45e99ab0e336 100644
--- a/resources/views/pdf-designs/clean.html
+++ b/resources/views/pdf-designs/clean.html
@@ -9,6 +9,7 @@
-moz-osx-font-smoothing: grayscale;
font-family: Arial, Helvetica, sans-serif;
font-size: "$font_size";
+ zoom: 80%;
}
@page {
@@ -33,7 +34,6 @@
#company-details {
display: flex;
flex-direction: column;
- color: #9f9f9f;
}
#company-details > span:first-child {
@@ -43,12 +43,12 @@
#company-address {
display: flex;
flex-direction: column;
- color: #9f9f9f;
}
.entity-label {
text-transform: uppercase;
margin-top: 3.5rem;
+ padding-left: 1rem;
margin-bottom: 1rem;
font-weight: bold;
color: var(--primary-color);
@@ -58,8 +58,8 @@
display: grid;
grid-template-columns: 1fr 1fr;
padding: 1rem;
- border-top: 1px solid #9f9f9f;
- border-bottom: 1px solid #9f9f9f;
+ border-top: 1px solid #d8d8d8;
+ border-bottom: 1px solid #d8d8d8;
}
#entity-details {
@@ -110,10 +110,17 @@
padding-left: 1rem;
}
+ #product-table > thead > tr > th:nth-last-child(1),
+ #delivery-note-table > thead > tr > th:nth-last-child(1),
+ #task-table > thead > tr > th:nth-last-child(1) {
+ text-align: right;
+ }
+
#product-table > tbody > tr > td,
#delivery-note-table > tbody > tr > td,
#task-table > tbody > tr > td {
- border-bottom: 1px solid #9f9f9f;
+ border-top: 1px solid #d8d8d8;
+ border-bottom: 1px solid #d8d8d8;
padding: 1rem;
}
@@ -123,6 +130,12 @@
color: var(--primary-color);
}
+ #product-table > tbody > tr > td:last-child,
+ #delivery-note-table > tbody > tr > td:last-child,
+ #task-table > tbody > tr > td:last-child {
+ text-align: right;
+ }
+
#product-table > tbody > tr:nth-child(odd),
#delivery-note-table > tbody > tr:nth-child(odd),
#task-table > tbody > tr:nth-child(odd) {
@@ -133,12 +146,24 @@
page-break-inside: avoid;
}
- #table-totals > * {
+ #table-totals {
display: grid;
- grid-template-columns: 3fr 1fr 1fr;
+ grid-template-columns: 2fr 1fr;
padding-top: .5rem;
- padding-left: 1rem;
- gap: 20px;
+ gap: 80px;
+ }
+
+ #table-totals .totals-table-right-side>* {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(1) {
+ text-align: left;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(2) {
+ text-align: right;
}
#table-totals
diff --git a/resources/views/pdf-designs/creative.html b/resources/views/pdf-designs/creative.html
index 90d645930999..e9026344f4eb 100644
--- a/resources/views/pdf-designs/creative.html
+++ b/resources/views/pdf-designs/creative.html
@@ -9,6 +9,7 @@
-moz-osx-font-smoothing: grayscale;
font-family: Arial, Helvetica, sans-serif;
font-size: "$font_size";
+ zoom: 80%;
}
@page {
@@ -37,6 +38,11 @@
flex-direction: column;
}
+ [data-ref="company_details-company.name"] {
+ color: var(--primary-color);
+ font-weight: bold;
+ }
+
.header-wrapper #client-details > *:first-child {
font-weight: bold;
}
@@ -136,10 +142,24 @@
page-break-inside: avoid;
}
- #table-totals > * {
+ #table-totals {
display: grid;
- grid-template-columns: 3fr 1fr 1fr;
+ grid-template-columns: 2fr 1fr;
padding-top: 1rem;
+ gap: 80px;
+ }
+
+ #table-totals .totals-table-right-side>* {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(1) {
+ text-align: left;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(2) {
+ text-align: right;
}
#table-totals
@@ -153,11 +173,6 @@
padding-left: 1rem;
}
- #table-totals > *:last-child > * {
- border-top: 5px solid var(--primary-color);
- padding-top: 1rem;
- }
-
#table-totals > * > :last-child {
text-align: right;
padding-right: 1rem;
diff --git a/resources/views/pdf-designs/elegant.html b/resources/views/pdf-designs/elegant.html
index 3c6b00b4c553..367ee8f13ac6 100644
--- a/resources/views/pdf-designs/elegant.html
+++ b/resources/views/pdf-designs/elegant.html
@@ -9,6 +9,7 @@
-moz-osx-font-smoothing: grayscale;
font-family: Arial, Helvetica, sans-serif;
font-size: "$font_size";
+ zoom: 80%;
}
@page {
@@ -32,11 +33,6 @@
height: 5rem;
}
- .double-border {
- margin-top: 3px;
- border-color: black;
- }
-
.client-entity-wrapper {
display: grid;
grid-template-columns: 1.8fr 1.2fr;
@@ -121,6 +117,7 @@
#delivery-note-table > tbody > tr > td,
#task-table > tbody > tr > td {
border-bottom: 1px solid;
+ border-top: 1px solid;
padding: 1rem;
}
@@ -130,25 +127,29 @@
text-align: right;
}
- .thanks-label {
- text-align: center;
- margin-top: 6rem;
- font-size: 1.5rem;
- font-weight: bold;
- padding-bottom: 1rem;
- border-bottom: 4px solid;
- }
-
#table-totals {
page-break-inside: avoid;
}
- #table-totals > * {
+ #table-totals {
display: grid;
- grid-template-columns: 3fr 1fr 1fr;
+ grid-template-columns: 2fr 1fr;
padding-top: 0.5rem;
padding-left: 1rem;
- gap: 20px;
+ gap: 80px;
+ }
+
+ #table-totals .totals-table-right-side>* {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(1) {
+ text-align: left;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(2) {
+ text-align: right;
}
#table-totals
@@ -214,8 +215,5 @@
-$thanks_label!
-
-
diff --git a/resources/views/pdf-designs/hipster.html b/resources/views/pdf-designs/hipster.html
index c806af01bc42..a36bb42ad376 100644
--- a/resources/views/pdf-designs/hipster.html
+++ b/resources/views/pdf-designs/hipster.html
@@ -9,6 +9,7 @@
-moz-osx-font-smoothing: grayscale;
font-family: Arial, Helvetica, sans-serif;
font-size: "$font_size";
+ zoom: 80%;
}
@page {
@@ -71,11 +72,7 @@
.entity-label {
font-size: 3rem;
text-transform: uppercase;
- margin: 2rem 1rem;
- }
-
- .entity-details-wrapper {
- margin: 1rem;
+ margin: 2rem 0;
}
.entity-details-wrapper > * {
@@ -150,12 +147,24 @@
page-break-inside: avoid;
}
- #table-totals > * {
+ #table-totals {
display: grid;
- grid-template-columns: 3fr 1fr 1fr;
+ grid-template-columns: 2fr 1fr;
padding-top: 0.5rem;
- padding-left: 1rem;
- gap: 20px;
+ gap: 80px;
+ }
+
+ #table-totals .totals-table-right-side>* {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(1) {
+ text-align: left;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(2) {
+ text-align: right;
}
#table-totals
diff --git a/resources/views/pdf-designs/modern.html b/resources/views/pdf-designs/modern.html
index 0a0c2acb84b0..dcc24a87a4d3 100644
--- a/resources/views/pdf-designs/modern.html
+++ b/resources/views/pdf-designs/modern.html
@@ -11,6 +11,7 @@
font-size: "$font_size";
margin: 0;
padding: 0;
+ zoom: 80%;
}
@page {
@@ -28,11 +29,15 @@
color: white;
display: grid;
grid-template-columns: 1.5fr 1fr;
- padding: 1.5rem;
- width: 100%;
+ padding: 3rem;
+ min-width: 100%;
height: 160px;
}
+ .company-name {
+ text-align: left;
+ }
+
.header-container .company-name {
font-size: 2rem;
}
@@ -53,7 +58,7 @@
}
.logo-client-wrapper {
- margin: 3rem 1.5rem;
+ margin: 3rem 2rem;
display: grid;
grid-template-columns: 1.5fr 1fr;
}
@@ -68,7 +73,7 @@
}
.table-wrapper {
- margin: 3rem 1.5rem;
+ margin: 3rem 2rem;
}
#product-table,
@@ -98,7 +103,6 @@
padding: 0.8rem;
background-color: var(--secondary-color);
color: white;
- width: 100%;
}
#product-table > thead > tr > th:last-child,
@@ -129,8 +133,9 @@
.footer-wrapper {
margin-top: 1rem;
background-color: var(--primary-color);
- padding: 1rem;
- height: 160px;
+ padding-left: 3rem;
+ padding-right: 3rem;
+ height: 220px;
width: 100%;
position: fixed;
bottom: 0;
@@ -142,6 +147,7 @@
width: 100%;
grid-template-columns: 1fr 1fr 1fr;
color: #fff4e9;
+ max-height: 140px;
}
#company-address,
@@ -161,12 +167,26 @@
page-break-inside: avoid;
}
- #table-totals > * {
+ #table-totals {
display: grid;
- grid-template-columns: 3fr 1fr 1fr;
- margin-top: 0.5rem;
- margin-right: 1.5rem;
- margin-left: 1.5rem;
+ grid-template-columns: 2fr 1fr;
+ padding-top: .5rem;
+ padding-left: 3rem;
+ padding-right: 3rem;
+ gap: 80px;
+ }
+
+ #table-totals .totals-table-right-side>* {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(1) {
+ text-align: left;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(2) {
+ text-align: right;
}
#table-totals
@@ -179,22 +199,6 @@
font-size: 1.3rem;
}
- #table-totals > * > * {
- padding-left: 1.5rem;
- }
-
- #table-totals > * > :last-child {
- text-align: right;
- padding-right: 1rem;
- }
-
- #table-totals > *:last-child {
- background-color: var(--secondary-color);
- color: white;
- padding-top: 0.7rem;
- padding-bottom: 0.7rem;
- }
-
table.page-container {
page-break-after: always;
min-width: 100%;
@@ -207,6 +211,10 @@
tfoot.page-footer {
display: table-footer-group;
}
+
+ .page-content-cell {
+ padding: 1rem;
+ }
diff --git a/resources/views/pdf-designs/plain.html b/resources/views/pdf-designs/plain.html
index ef8909549ae6..6e0681def734 100644
--- a/resources/views/pdf-designs/plain.html
+++ b/resources/views/pdf-designs/plain.html
@@ -9,6 +9,7 @@
-moz-osx-font-smoothing: grayscale;
font-family: Arial, Helvetica, sans-serif;
font-size: "$font_size";
+ zoom: 80%;
}
@page {
@@ -114,12 +115,25 @@
page-break-inside: avoid;
}
- #table-totals > * {
+ #table-totals {
display: grid;
- grid-template-columns: 3fr 1fr 1fr;
+ grid-template-columns: 2fr 1fr;
padding-top: .5rem;
padding-left: 1rem;
- gap: 20px;
+ gap: 80px;
+ }
+
+ #table-totals .totals-table-right-side>* {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(1) {
+ text-align: left;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(2) {
+ text-align: right;
}
#table-totals
diff --git a/resources/views/pdf-designs/playful.html b/resources/views/pdf-designs/playful.html
index be7c90815b44..3cf3caac55c3 100644
--- a/resources/views/pdf-designs/playful.html
+++ b/resources/views/pdf-designs/playful.html
@@ -9,10 +9,11 @@
-moz-osx-font-smoothing: grayscale;
font-family: Arial, Helvetica, sans-serif;
font-size: "$font_size";
+ zoom: 80%;
}
@page {
- margin: $global_margin;
+ margin: -0.25cm !important;
}
p {
@@ -21,8 +22,10 @@
}
.header-wrapper {
+ margin-top: 2rem;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
+ padding: 2rem 3rem;
}
.header-wrapper .company-logo {
@@ -47,10 +50,10 @@
}
.contacts-wrapper {
- margin-top: 3rem;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 40px;
+ padding: 3rem;
}
.contacts-wrapper .contact-label {
@@ -90,7 +93,7 @@
#product-table,
#delivery-note-table,
#task-table {
- margin-top: 3rem;
+ padding: 3rem;
/* margin-bottom: 200px; */
min-width: 100%;
table-layout: fixed;
@@ -141,6 +144,7 @@
#product-table > tbody > tr > td,
#delivery-note-table > tbody > tr > td,
#task-table > tbody > tr > td {
+ background-color: #F7F7F7;
border-bottom: 1px solid var(--primary-color);
padding: 1rem;
}
@@ -161,12 +165,25 @@
page-break-inside: avoid;
}
- #table-totals > * {
+ #table-totals {
display: grid;
- grid-template-columns: 3fr 1fr 1fr;
- padding-top: 0.5rem;
- padding-left: 1rem;
- gap: 20px;
+ grid-template-columns: 2fr 1fr;
+ gap: 80px;
+ padding-left: 3rem;
+ padding-right: 3rem;
+ }
+
+ #table-totals .totals-table-right-side>* {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(1) {
+ text-align: left;
+ }
+
+ #table-totals>.totals-table-right-side>*> :nth-child(2) {
+ text-align: right;
}
#table-totals
@@ -188,9 +205,45 @@
text-align: right;
padding-right: 1rem;
}
+
+ #header {
+ position: fixed;
+ top: 0;
+ min-width: 100%;
+ display: grid;
+ grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
+ margin-left: -10px;
+ }
+
+ #header > * {
+ padding: 10px;
+ }
+
+ #footer {
+ position: fixed;
+ bottom: 0;
+ min-width: 100%;
+ display: grid;
+ grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
+ margin-left: -10px;
+ }
+
+ #footer > * {
+ padding: 5px;
+ }
-
+
+
-
+