1.4.0

API.md

@@ -15,7 +15,7 @@
 - **editable**: `Boolean (default:true)` - *Used to disable the entire document modification*
 - **overlay**: `Function(page: Number, total: Number) => String` (optional) - *Function that outputs HTML overlay (header, footer, page numbers, ...) for each page depending of the arguments (`page` starts at 1). Placement inside the page should be set in CSS by setting `position: absolute` and `left, top, right, bottom` for each element.*
 - **page_format_mm**: `[width, height] (default:[210, 297])` - *Page format in mm*
-- **page_margins**: `String (default:"10mm 15mm")` - *Page margins in CSS format*
+- **page_margins**: `String (default:"10mm 15mm") or Function(page: Number, total: Number => String` - *Page margins in CSS format*
 - **zoom**: `Number (default:1.0)`- *Display zoom. Only acts on the screen display*
 
 ## Data

CHANGELOG.md

@@ -1,5 +1,8 @@
 ###### :speech_balloon: For v2.x (Vue3) releases, see the master branch
 
+## v1.4.0
+- User can now provide a function for `page_margins`, to set margins specific to the page number (for more info read the [API](API.md))
+
 ## v1.3.0
 
 - SCSS has been converted to basic CSS, so you don't have to install a SCSS compiler anymore

src/Demo/Demo.vue

@@ -259,7 +259,7 @@ export default {
     // Margins management
     current_margins_name () {
       const margins = this.margins.find(([, margins]) => (this.page_margins == margins));
-      return margins ? margins[0] : margins[1];
+      return margins ? margins[0] : this.page_margins;
     },
     margins: () => [
       ["Medium", "20mm"],

src/DocumentEditor/DocumentEditor.vue

@@ -61,7 +61,7 @@ export default {
 
     // Page margins in CSS
     page_margins: {
-      type: String,
+      type: [String, Function],
       default: "10mm 15mm"
     },
 
@@ -378,7 +378,7 @@ export default {
           top: "calc("+ top_mm +"mm + "+ view_padding +"px)",
           width: this.page_format_mm[0]+"mm",
           // "height" is set below
-          padding: this.page_margins,
+          padding: (typeof this.page_margins == "function") ? this.page_margins(page_idx + 1, this.pages.length) : this.page_margins,
           transform: "scale("+ this.zoom +")"
         }
         style[allow_overflow ? "minHeight" : "height"] = this.page_format_mm[1]+"mm";
@@ -418,7 +418,7 @@ export default {
         const page_clone = page_elt.cloneNode(true);
         page_clone.style = ""; // reset page style for the clone
         page_clone.style.position = "relative";
-        page_clone.style.padding = this.page_margins;
+        page_clone.style.padding = (typeof this.page_margins == "function") ? this.page_margins(page_idx + 1, this.pages.length) : this.page_margins;
         page_clone.style.breakBefore = page_idx ? "page" : "auto";
 
         // add overlays if any