From 48dae6a33bdfd2131ecb7ca7f71a21cd8351dc0e Mon Sep 17 00:00:00 2001
From: Antoine Barrier <antoine.barrier13@gmail.com>
Date: Sun, 7 Jul 2024 16:29:25 +0200
Subject: [PATCH 1/4] feat: user can now change the background of the whole
document
---
.../print_designer/jinja/macros/styles.html | 14 +++++++++++++-
.../page/print_designer/jinja/print_format.html | 3 ++-
.../js/print_designer/PropertiesPanelState.js | 17 +++++++++++++++++
.../public/js/print_designer/store/MainStore.js | 2 ++
4 files changed, 34 insertions(+), 2 deletions(-)
diff --git a/print_designer/print_designer/page/print_designer/jinja/macros/styles.html b/print_designer/print_designer/page/print_designer/jinja/macros/styles.html
index f359778f..fccc0666 100644
--- a/print_designer/print_designer/page/print_designer/jinja/macros/styles.html
+++ b/print_designer/print_designer/page/print_designer/jinja/macros/styles.html
@@ -1,16 +1,28 @@
{% macro render_styles(settings) %}
<style>
+ #filler{
+ background-color: {{ settings.page.backgroundColor}};
+ margin-top: -10px; /* Come back to avoid strange gray line between the content and filler */
+ height: 10000%; /* Fill the entire page even for huge formats */
+ position: fixed;
+ width: 10000%; /* Fill the entire page even for huge formats */
+ z-index: 0;
+ }
.print-format {
box-sizing: border-box;
padding: 0in;
max-width: {{convert_uom(number=settings.page.width, to_uom="mm")}} !important;
dpi: {{settings.PDFPrintDPI or 96}}mm;
page-width: {{convert_uom(number=settings.page.width, to_uom="mm")}};
+ /* 5mm margin to avoid strange blank */
+ /* vertical line to the right */
+ page-width: {{convert_uom(number=settings.page.width - ((settings.page.width % 2 + 1) * 2), to_uom="mm")}};
page-height: {{convert_uom(number=settings.page.height, to_uom="mm")}};
margin-top:{{convert_uom(number=settings.page.headerHeightWithMargin or settings.page.marginTop, to_uom='mm')}};
margin-bottom:{{convert_uom(number=settings.page.footerHeightWithMargin or settings.page.marginBottom, to_uom='mm')}};
margin-left:{{convert_uom(number=settings.page.marginLeft, to_uom='mm')}};
margin-right:{{convert_uom(number=settings.page.marginRight, to_uom='mm')}};
+ background-color: {{ settings.page.backgroundColor}};
}
@media screen {
#__print_designer {
@@ -99,4 +111,4 @@
-webkit-box-sizing: border-box;
}
</style>
-{% endmacro %}
\ No newline at end of file
+{% endmacro %}
diff --git a/print_designer/print_designer/page/print_designer/jinja/print_format.html b/print_designer/print_designer/page/print_designer/jinja/print_format.html
index 988cb7ea..8227c727 100644
--- a/print_designer/print_designer/page/print_designer/jinja/print_format.html
+++ b/print_designer/print_designer/page/print_designer/jinja/print_format.html
@@ -33,5 +33,6 @@
</div>
</div>
</div>
+<div id="filler"/>
-{{ render_styles(settings) }}
\ No newline at end of file
+{{ render_styles(settings) }}
diff --git a/print_designer/public/js/print_designer/PropertiesPanelState.js b/print_designer/public/js/print_designer/PropertiesPanelState.js
index c9e9b3d7..d82c2b5d 100644
--- a/print_designer/public/js/print_designer/PropertiesPanelState.js
+++ b/print_designer/public/js/print_designer/PropertiesPanelState.js
@@ -389,6 +389,23 @@ export const createPropertiesPanel = () => {
});
},
},
+ {
+ label: "Background",
+ name: "pageBackground",
+ isLabelled: true,
+ condtional: null,
+ frappeControl: (ref, name) => {
+ const { page } = storeToRefs(MainStore);
+ makeFeild({
+ name,
+ ref,
+ fieldtype: "Color",
+ requiredData: () => page.backgroundColor,
+ reactiveObject: page,
+ propertyName: "backgroundColor",
+ });
+ },
+ },
[
pageInput("Height", "page_height", "height", {
parentBorderTop: true,
diff --git a/print_designer/public/js/print_designer/store/MainStore.js b/print_designer/public/js/print_designer/store/MainStore.js
index 2cd78d45..a8066019 100644
--- a/print_designer/public/js/print_designer/store/MainStore.js
+++ b/print_designer/public/js/print_designer/store/MainStore.js
@@ -91,6 +91,7 @@ export const useMainStore = defineStore("MainStore", {
headerHeightWithMargin: 0,
footerHeightWithMargin: 0,
UOM: "mm",
+ backgroundColor: "#ffffff",
},
controls: {
MousePointer: {
@@ -185,6 +186,7 @@ export const useMainStore = defineStore("MainStore", {
},
getPageSettings() {
return {
+ backgroundColor: this.page.backgroundColor,
height:
this.convertToPageUOM(
this.page.height - (this.page.marginTop + this.page.marginBottom)
From 1e10a9a593d2c018e5da95c01fbee53290424144 Mon Sep 17 00:00:00 2001
From: Antoine Barrier <antoine.barrier13@gmail.com>
Date: Sun, 7 Jul 2024 16:41:04 +0200
Subject: [PATCH 2/4] fix: changed the filler margin
---
.../print_designer/page/print_designer/jinja/macros/styles.html | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/print_designer/print_designer/page/print_designer/jinja/macros/styles.html b/print_designer/print_designer/page/print_designer/jinja/macros/styles.html
index fccc0666..c8914354 100644
--- a/print_designer/print_designer/page/print_designer/jinja/macros/styles.html
+++ b/print_designer/print_designer/page/print_designer/jinja/macros/styles.html
@@ -2,7 +2,7 @@
<style>
#filler{
background-color: {{ settings.page.backgroundColor}};
- margin-top: -10px; /* Come back to avoid strange gray line between the content and filler */
+ margin-top: -1px; /* Come back to avoid strange gray line between the content and filler */
height: 10000%; /* Fill the entire page even for huge formats */
position: fixed;
width: 10000%; /* Fill the entire page even for huge formats */
From 0914fffbcda974afa14e7de72e2d71ccd7bb296e Mon Sep 17 00:00:00 2001
From: Antoine Barrier <antoine.barrier13@gmail.com>
Date: Sun, 7 Jul 2024 17:57:57 +0200
Subject: [PATCH 3/4] fix: send filler to background
---
.../print_designer/page/print_designer/jinja/macros/styles.html | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/print_designer/print_designer/page/print_designer/jinja/macros/styles.html b/print_designer/print_designer/page/print_designer/jinja/macros/styles.html
index c8914354..5faddb00 100644
--- a/print_designer/print_designer/page/print_designer/jinja/macros/styles.html
+++ b/print_designer/print_designer/page/print_designer/jinja/macros/styles.html
@@ -6,7 +6,7 @@
height: 10000%; /* Fill the entire page even for huge formats */
position: fixed;
width: 10000%; /* Fill the entire page even for huge formats */
- z-index: 0;
+ z-index: -1; /* Send to back */
}
.print-format {
box-sizing: border-box;
From dbdcdd3395babf3f9588a22c9042985038875aa2 Mon Sep 17 00:00:00 2001
From: Antoine Barrier <antoine.barrier13@gmail.com>
Date: Mon, 8 Jul 2024 09:30:04 +0200
Subject: [PATCH 4/4] feat: added belleza and mukta fonts
---
print_designer/public/js/print_designer/defaultObjects.js | 5 +++++
1 file changed, 5 insertions(+)
diff --git a/print_designer/public/js/print_designer/defaultObjects.js b/print_designer/public/js/print_designer/defaultObjects.js
index ef6ad21d..9bee19d9 100644
--- a/print_designer/public/js/print_designer/defaultObjects.js
+++ b/print_designer/public/js/print_designer/defaultObjects.js
@@ -267,6 +267,7 @@ export const GoogleFonts = {
[400, 500, 600, 700],
],
BioRhyme: [[200, 300, 400, 700, 800], []],
+ Belleza: [[400], []],
Cardo: [[400, 700], [400]],
Chivo: [
[100, 200, 300, 400, 500, 600, 700, 800, 900],
@@ -328,6 +329,10 @@ export const GoogleFonts = {
[100, 200, 300, 400, 500, 600, 700, 800, 900],
[100, 200, 300, 400, 500, 600, 700, 800, 900],
],
+ Mukta: [
+ [200, 300, 400, 500, 600, 700, 800],
+ [200, 300, 400, 500, 600, 700, 800],
+ ],
Neuton: [[200, 300, 400, 700, 800], [400]],
Nunito: [
[200, 300, 400, 500, 600, 700, 800, 900],