Merge pull request #4690 from beganovich/v5-0114-design-improvements

(v5) Invoices/quotes design improvements
2024-09-21 08:51:34 +02:00 · 2021-01-15 08:34:03 +11:00 · 2021-01-15 08:34:03 +11:00 · fc6384f051
commit fc6384f051
parent e9b9ea642c ec80d925a4
10 changed files with 79 additions and 93 deletions
--- a/app/Utils/HtmlEngine.php
+++ b/app/Utils/HtmlEngine.php
@ -96,7 +96,7 @@ class HtmlEngine
        }

        $data = [];
-        $data['$global_margin'] = ['value' => '0cm', 'label' => ''];
+        $data['$global_margin'] = ['value' => '6.35mm', 'label' => ''];
        $data['$tax'] = ['value' => '', 'label' => ctrans('texts.tax')];
        $data['$app_url'] = ['value' => $this->generateAppUrl(), 'label' => ''];
        $data['$from'] = ['value' => '', 'label' => ctrans('texts.from')];
--- a/resources/views/pdf-designs/bold.html
+++ b/resources/views/pdf-designs/bold.html
@ -4,17 +4,15 @@
        --secondary-color: $ secondary_color;
    }

-    * {
-        margin: 0;
-        padding: 0;
-        font-size: "$font_size";
-    }
-
    body {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-family: Arial, Helvetica, sans-serif;
-        margin: $global_margin;
+        font-size: "$font_size";
+    }
+
+    @page {
+        margin: -0.25cm !important;
    }

    p {
@ -23,13 +21,6 @@
        page-break-after: always;
    }

-    @media print {
-        body {
-            margin-top: 0;
-            margin-right: 0;
-        }
-    }
-
    .header-wrapper {
        display: grid;
        grid-template-columns: 1.5fr 1fr 1fr;
@ -93,7 +84,7 @@
        /* margin-bottom: 200px; */
    }

-    .task-duration {
+    .task-time-details {
        display: block;
        margin-top: 5px;
        color: grey;
@ -108,7 +99,7 @@
    #product-table > thead > tr > th,
    #delivery-note-table > thead > tr > th,
    #task-table > thead > tr > th {
-        padding: 2rem;
+        padding: 1.5rem;
        font-size: 1.5rem;
    }

@ -176,6 +167,7 @@
    }
 </style>

+
 <div class="header-wrapper" id="header">
    <div></div>

--- a/resources/views/pdf-designs/business.html
+++ b/resources/views/pdf-designs/business.html
@ -102,7 +102,7 @@
        overflow-wrap: break-word;
    }

-    .task-duration {
+    .task-time-details {
        display: block;
        margin-top: 5px;
        color: grey;
@ -168,13 +168,6 @@
        font-weight: bold !important;
    }

-    @media print {
-        body {
-            margin-top: 0;
-            margin-right: 0;
-        }
-    }
-
    #table-totals {
        page-break-inside: avoid;
    }
--- a/resources/views/pdf-designs/clean.html
+++ b/resources/views/pdf-designs/clean.html
@ -9,6 +9,9 @@
        -moz-osx-font-smoothing: grayscale;
        font-family: Arial, Helvetica, sans-serif;
        font-size: "$font_size";
+    }
+
+    @page {
        margin: $global_margin;
    }

@ -87,7 +90,7 @@
        overflow-wrap: break-word;
    }

-    .task-duration {
+    .task-time-details {
        display: block;
        margin-top: 5px;
        color: grey;
--- a/resources/views/pdf-designs/creative.html
+++ b/resources/views/pdf-designs/creative.html
@ -4,33 +4,20 @@
        --secondary-color: $secondary_color;
    }

-    * {
+    body {
+        -webkit-font-smoothing: antialiased;
+        -moz-osx-font-smoothing: grayscale;
+        font-family: Arial, Helvetica, sans-serif;
        font-size: "$font_size";
    }

+    @page {
+        margin: $global_margin;
+    }
+
    p {
        margin: 0;
        padding: 0;
-        page-break-after: always;
-    }
-
-    body {
-        -webkit-font-smoothing: antialiased;
-        -moz-osx-font-smoothing: grayscale;
-        font-family: Arial, Helvetica, sans-serif;
-        margin-top: 1cm;
-        margin-bottom: 1cm;
-    }
-
-    @media print {
-        body {
-            margin: 0;
-            padding: 0;
-        }
-    }
-
-    body {
-        margin: $global_margin;
    }

    .header-wrapper {
@ -102,7 +89,7 @@
        margin-top: 3rem;
    }

-    .task-duration {
+    .task-time-details {
        display: block;
        margin-top: 5px;
        color: grey;
--- a/resources/views/pdf-designs/elegant.html
+++ b/resources/views/pdf-designs/elegant.html
@ -4,22 +4,22 @@
        --secondary-color: $secondary_color;
    }

-    * {
+    body {
+        -webkit-font-smoothing: antialiased;
+        -moz-osx-font-smoothing: grayscale;
+        font-family: Arial, Helvetica, sans-serif;
        font-size: "$font_size";
    }

+    @page {
+        margin: $global_margin;
+    }
+
    p {
        margin: 0;
        padding: 0;
    }

-    body {
-        -webkit-font-smoothing: antialiased;
-        -moz-osx-font-smoothing: grayscale;
-        font-family: Arial, Helvetica, sans-serif;
-        margin: $global_margin;
-    }
-
    .company-logo-wrapper {
        display: flex;
        flex-direction: row;
@ -89,7 +89,7 @@
        overflow-wrap: break-word;
    }

-    .task-duration {
+    .task-time-details {
        display: block;
        margin-top: 5px;
        color: grey;
--- a/resources/views/pdf-designs/hipster.html
+++ b/resources/views/pdf-designs/hipster.html
@ -4,25 +4,22 @@
        --secondary-color: $secondary_color;
    }

-    * {
+    body {
+        -webkit-font-smoothing: antialiased;
+        -moz-osx-font-smoothing: grayscale;
+        font-family: Arial, Helvetica, sans-serif;
        font-size: "$font_size";
    }

+    @page {
+        margin: $global_margin;
+    }
+
    p {
        margin: 0;
        padding: 0;
    }

-    body {
-        -webkit-font-smoothing: antialiased;
-        -moz-osx-font-smoothing: grayscale;
-        font-family: Arial, Helvetica, sans-serif;
-    }
-
-    @page {
-        margin: $global_margin;
-    }
-
    .header-wrapper {
        display: grid;
        grid-template-columns: 1.2fr 1.8fr;
@ -107,7 +104,7 @@
        overflow-wrap: break-word;
    }

-    .task-duration {
+    .task-time-details {
        display: block;
        margin-top: 5px;
        color: grey;
--- a/resources/views/pdf-designs/modern.html
+++ b/resources/views/pdf-designs/modern.html
@ -4,18 +4,19 @@
        --secondary-color: $secondary_color;
    }

-    * {
-        font-size: "$font_size";
-    }
-
    body {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-family: Arial, Helvetica, sans-serif;
+        font-size: "$font_size";
        margin: 0;
        padding: 0;
    }

+    @page {
+        margin: -0.22cm;
+    }
+
    p {
        margin: 0;
        padding: 0;
@ -78,10 +79,17 @@
        overflow-wrap: break-word;
    }

+    .task-time-details {
+        display: block;
+        margin-top: 5px;
+        color: grey;
+    }
+
    #product-table > thead,
    #delivery-note-table > thead,
    #task-table > thead {
        text-align: left;
+        width: 100%;
    }

    #product-table > thead > tr > th,
@ -90,6 +98,7 @@
        padding: 0.8rem;
        background-color: var(--secondary-color);
        color: white;
+        width: 100%;
    }

    #product-table > thead > tr > th:last-child,
@ -188,6 +197,7 @@

    table.page-container {
        page-break-after: always;
+        min-width: 100%;
    }

    thead.page-header {
--- a/resources/views/pdf-designs/plain.html
+++ b/resources/views/pdf-designs/plain.html
@ -1,21 +1,25 @@
 <style id="style">
-    * {
-        font-size: "$font_size";
-    }
-
-    p {
-        margin: 0;
-        padding: 0;
-        page-break-after: always;
+    :root {
+        --primary-color: $primary_color;
+        --secondary-color: $secondary_color;
    }

    body {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        font-family: Arial, Helvetica, sans-serif;
+        font-size: "$font_size";
+    }
+
+    @page {
        margin: $global_margin;
    }

+    p {
+        margin: 0;
+        padding: 0;
+    }
+
    .header-wrapper {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
@ -68,7 +72,7 @@
        /* margin-bottom: 200px; */
    }

-    .task-duration {
+    .task-time-details {
        display: block;
        margin-top: 5px;
        color: grey;
--- a/resources/views/pdf-designs/playful.html
+++ b/resources/views/pdf-designs/playful.html
@ -4,22 +4,22 @@
        --secondary-color: $secondary_color;
    }

-    * {
+    body {
+        -webkit-font-smoothing: antialiased;
+        -moz-osx-font-smoothing: grayscale;
+        font-family: Arial, Helvetica, sans-serif;
        font-size: "$font_size";
    }

+    @page {
+        margin: $global_margin;
+    }
+
    p {
        margin: 0;
        padding: 0;
    }

-    body {
-        -webkit-font-smoothing: antialiased;
-        -moz-osx-font-smoothing: grayscale;
-        font-family: Arial, Helvetica, sans-serif;
-        margin: $global_margin;
-    }
-
    .header-wrapper {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
@ -97,7 +97,7 @@
        overflow-wrap: break-word;
    }

-    .task-duration {
+    .task-time-details {
        display: block;
        margin-top: 5px;
        color: grey;