Mirrors/invoiceninja
1
0
Fork 0
mirror of https://github.com/invoiceninja/invoiceninja.git synced 2024-11-11 05:32:39 +01:00
Code Issues Releases Activity

Merge pull request #4124 from beganovich/v2-primary-color-on-invoice-designs

Browse Source 
Using primary & secondary colors in the invoice designs
This commit is contained in:
David Bomba 2020-10-01 21:43:01 +10:00 committed by GitHub
commit 864751fdd4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 76 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
app/Utils/HtmlEngine.php
View File

@ -321,6 +321,9 @@ class HtmlEngine
$data['$invoiceninja.whitelabel'] = ['value' => asset('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' => ''];
// $data['custom_label1'] = ['value' => '', 'label' => ctrans('texts.')];
// $data['custom_label2'] = ['value' => '', 'label' => ctrans('texts.')];
// $data['custom_label3'] = ['value' => '', 'label' => ctrans('texts.')];

9
resources/views/pdf-designs/bold.html
View File

@ -5,6 +5,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style id="style">
:root {
--primary-color: $primary_color;
--secondary-color: $secondary_color;
}
* {
margin: 0;
padding: 0;
@ -66,7 +71,7 @@
}
.entity-details-wrapper {
background-color: #35a39a;
background-color: var(--primary-color);
padding: 1rem;
}
@ -133,7 +138,7 @@
#product-table-footer
> *
[data-element='product-table-balance-due'] {
color: #35a39a;
color: var(--primary-color);
}
#product-table-footer > * > :last-child {
text-align: right;

13
resources/views/pdf-designs/business.html
View File

@ -5,6 +5,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style id="style">
:root {
--primary-color: $primary_color;
--secondary-color: $secondary_color;
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
@ -66,7 +71,7 @@
#client-details {
display: flex;
flex-direction: column;
color: #ec782f;
color: var(--primary-color);
}
#client-details > * {
margin-bottom: 0.5rem;
@ -76,7 +81,7 @@
}
#entity-details {
background-color: #ec782f;
background-color: var(--primary-color);
padding: 0.8rem;
border-radius: 1rem;
width: 100%;
@ -95,7 +100,7 @@
}
#product-table > thead {
text-align: left;
background: #394e6b;
background: var(--secondary-color);
}
#product-table > thead > tr > th {
padding: 1rem;
@ -124,7 +129,7 @@
[data-element='product-table-balance-due-label'],
[data-element='product-table-balance-due'] {
color: #394e6b !important;
color: var(--secondary-color) !important;
font-weight: bold !important;
}

13
resources/views/pdf-designs/clean.html
View File

@ -6,6 +6,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style id="style">
:root {
--primary-color: $primary_color;
--secondary-color: $secondary_color;
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
@ -34,7 +39,7 @@
color: #9f9f9f;
}
#company-details > span:first-child {
color: #67b1cc;
color: var(--primary-color);
}
#company-address {
@ -48,7 +53,7 @@
margin-top: 3.5rem;
margin-bottom: 1rem;
font-weight: semibold;
color: #67b1cc;
color: var(--primary-color);
}
.client-and-entity-wrapper {
@ -97,7 +102,7 @@
padding: 1rem;
}
#product-table > tbody > tr > td:first-child {
color: #67b1cc;
color: var(--primary-color);
}
#product-table > tbody > tr:nth-child(odd) {
background-color: #f5f5f5;
@ -125,7 +130,7 @@
#product-table-footer
> *
[data-element='product-table-balance-due'] {
color: #67b1cc;
color: var(--primary-color);
}
#product-table-footer > * > :last-child {
text-align: right;

13
resources/views/pdf-designs/creative.html
View File

@ -5,6 +5,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style id="style">
:root {
--primary-color: $primary_color;
--secondary-color: $secondary_color;
}
* {
font-size: '$font-size';
}
@ -66,7 +71,7 @@
text-transform: uppercase;
}
.entity-label-wrapper .entity-label > *:last-child {
color: #b21c53;
color: var(--primary-color);
font-style: italic;
}
.entity-label-wrapper #entity-details {
@ -82,7 +87,7 @@
min-width: 100%;
table-layout: fixed;
overflow-wrap: break-word;
border-top: 5px solid #b21c53;
border-top: 5px solid var(--primary-color);
}
#product-table > thead {
text-align: left;
@ -117,13 +122,13 @@
> *
[data-element='product-table-balance-due'] {
font-weight: bold;
color: #b21c53;
color: var(--primary-color);
}
#product-table-footer > * > * {
padding-left: 1rem;
}
#product-table-footer > *:last-child > * {
border-top: 5px solid #b21c53;
border-top: 5px solid var(--primary-color);
padding-top: 1rem;
}
#product-table-footer > * > :last-child {

9
resources/views/pdf-designs/elegant.html
View File

@ -5,6 +5,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style id="style">
:root {
--primary-color: $primary_color;
--secondary-color: $secondary_color;
}
* {
font-size: '$font-size';
}
@ -86,7 +91,7 @@
font-size: 1.1rem;
padding-bottom: 1.5rem;
padding-left: 1rem;
color: #396d49;
color: var(--primary-color);
font-weight: medium;
}
#product-table > thead > tr > th:last-child {
@ -131,7 +136,7 @@
#product-table-footer
> *
[data-element='product-table-balance-due'] {
color: #396d49;
color: var(--primary-color);
}
#product-table-footer > * > :last-child {
text-align: right;

11
resources/views/pdf-designs/hipster.html
View File

@ -5,6 +5,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style id="style">
:root {
--primary-color: $primary_color;
--secondary-color: $secondary_color;
}
* {
font-size: '$font-size';
}
@ -30,7 +35,7 @@
.header-wrapper .header-text-label {
font-size: 1.1rem;
color: #bba238;
color: var(--primary-color);
text-transform: uppercase;
font-weight: bold;
}
@ -83,7 +88,7 @@
[data-element='entity-details-wrapper-invoice-number-label'],
.entity-details-wrapper
[data-element='entity-details-wrapper-amount-due'] {
color: #bba238;
color: var(--primary-color);
font-weight: bold;
}
@ -137,7 +142,7 @@
#product-table-footer
> *
[data-element='product-table-balance-due'] {
color: #bba238;
color: var(--primary-color);
}
#product-table-footer > * > :last-child {
text-align: right;

15
resources/views/pdf-designs/modern.html
View File

@ -5,6 +5,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style id="style">
:root {
--primary-color: $primary_color;
--secondary-color: $secondary_color;
}
* {
font-size: '$font-size';
}
@ -24,7 +29,7 @@
}
.header-container {
background-color: #f46521;
background-color: var(--primary-color);
color: white;
display: grid;
grid-template-columns: 1.5fr 1fr;
@ -79,14 +84,14 @@
}
#product-table > thead > tr > th {
padding: 0.8rem;
background-color: #3f3e3c;
background-color: var(--secondary-color);
color: white;
}
#product-table > thead > tr > th:last-child {
text-align: right;
}
#product-table > tbody > tr > td {
border-bottom: 1px solid #3f3e3c;
border-bottom: 1px solid var(--secondary-color);
padding: 1rem;
}
#product-table > tbody > tr > td:first-child {
@ -98,7 +103,7 @@
.footer-wrapper {
margin-top: 1rem;
background-color: #f46521;
background-color: var(--primary-color);
padding: 1rem;
height: 160px;
width: 100%;
@ -154,7 +159,7 @@
padding-right: 1rem;
}
#product-table-footer > *:last-child {
background-color: #3f3e3c;
background-color: var(--secondary-color);
color: white;
padding-top: 0.7rem;
padding-bottom: 0.7rem;

23
resources/views/pdf-designs/playful.html
View File

@ -5,6 +5,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style id="style">
:root {
--primary-color: $primary_color;
--secondary-color: $secondary_color;
}
* {
font-size: '$font-size';
}
@ -29,7 +34,7 @@
height: 5rem;
}
.header-wrapper .entity-details-wrapper {
background-color: #009e90;
background-color: var(--primary-color);
padding: 1rem;
border-radius: 10px;
}
@ -51,7 +56,7 @@
}
.contacts-wrapper .contact-label {
font-weight: bold;
color: #009e90;
color: var(--primary-color);
margin-left: 1rem;
}
.contacts-wrapper #company-address,
@ -64,7 +69,7 @@
.contacts-wrapper .company-info {
margin-top: 1rem;
padding: 1rem;
border-top: 1px solid #009e90;
border-top: 1px solid var(--primary-color);
display: grid;
grid-template-columns: 1fr 1fr;
gap: 10px;
@ -72,12 +77,12 @@
.contacts-wrapper #client-details {
margin-top: 1rem;
padding: 1rem;
border-top: 1px solid #009e90;
border-top: 1px solid var(--primary-color);
}
.contact-wrapper-left-side,
.contact-wrapper-right-side {
border-bottom: 1px solid #009e90;
border-bottom: 1px solid var(--primary-color);
}
#product-table {
@ -92,7 +97,7 @@
#product-table > thead > tr > th {
font-size: 1.2rem;
padding: 1rem;
background: #009e90;
background: var(--primary-color);
color: white;
}
#product-table > thead tr > th:last-child {
@ -107,11 +112,11 @@
border-bottom-right-radius: 10px;
}
#product-table > tbody > tr > td {
border-bottom: 1px solid #009e90;
border-bottom: 1px solid var(--primary-color);
padding: 1rem;
}
#product-table > tbody > tr > td:first-child {
color: #bb3a24;
color: var(--primary-color);
}
#product-table > tbody > tr > td:last-child {
text-align: right;
@ -139,7 +144,7 @@
#product-table-footer
> *
[data-element='product-table-balance-due'] {
color: #009e90;
color: var(--primary-color);
}
#product-table-footer > * > :last-child {
text-align: right;