add triplecate

maquette-tests/assets/css/01_var.css

@@ -4,6 +4,7 @@
     --font: 'Wagram Slab', serif;
     --font: 'Bilzig', serif;
      --font: 'Routed Gothic', sans-serif;
+     --font:  "Triplicate T4";
 
 
     /* --font: 'HAL Timezone', serif; */
@@ -18,6 +19,7 @@
     --font-notes: 'Selectric Mono', monospace;
     --font-notes: 'Baskemo Sans', monospace;
     
+      --font-ocr:  "OCR X";
 
 
      --font-sans: 'Routed Gothic', serif;
@@ -27,14 +29,14 @@
      /* --font-subtitle: 'Baskemo Sans', monospace; */
 
      --font-nav: 'Routed Gothic', sans-serif;
-
+       --font-nav:  "OCR X";
 
     --title: 'HNoailles Times Triplex', sans-serif;
 
-    --red: #9B0000;
+    --rouge: #9B0000;
-    --green:#009B00;
+    --vert:#009B00;
-    --green-light:#009b0025;
+    --vert-light:#009b0025;
-    --blue:  #00009B;
+    --bleu:  #00009B;
 
     --grey: #e4e4e4;
     --border-grey: 2px solid var(--grey);
@@ -42,15 +44,16 @@
 
     --indent: 7mm;
 
-    --font-size: 14px;
+    --font-size: 12.5px;
-    --baseline: 18px;
+    --baseline: 16px;
 
     --fs-nav: 11px;
     --fs-subtitle: 11px;
-    --fs-notes: 11px;
+    --fs-notes: 10px;
 
     --unit: 20px;
     --gap: 8px;
 
+    	--border: 4mm;
 
 }

maquette-tests/assets/css/03_layout.css

@@ -4,8 +4,8 @@
     size: 165mm 240mm;
     margin-top: 25mm;
     margin-bottom: 14mm;
-    bleed: 6mm;
+    /* bleed: 6mm;
-    marks: crop;
+    marks: crop; */
 
     margin-left: 33mm;
     margin-right: 11mm;
@@ -20,6 +20,9 @@
       width: 0px;
       vertical-align: top;
       padding-top: 8mm;
+      color: var(--rouge);
+        font-family: var(--font-nav);
+       font-weight: 120;
     }
 
 
@@ -30,6 +33,9 @@
       width: 100%;
       padding-top: 8mm;
       text-align: right;
+       color: var(--rouge);
+         font-family: var(--font-nav);
+       font-weight: 120;
     }
 
 
@@ -40,6 +46,10 @@
       padding-top: 8mm;
       text-align: left;
       margin-left: 11mm;
+       color: var(--rouge);
+       font-size: 14px;
+      font-family: var(--font-nav);
+       font-weight: 120;
 
     }
 
@@ -56,6 +66,9 @@
       width: 0px;
       vertical-align: top;
       padding-top: 8mm;
+       color: var(--bleu);
+       font-family: var(--font-nav);
+       font-weight: 120;
     }
 
     @top-right {
@@ -67,6 +80,9 @@
       position: relative;
       left: -11mm;
       width: 100%;
+         color: var(--bleu);
+             font-family: var(--font-nav);
+       font-weight: 120;
     }
 
     @top-right-corner {
@@ -77,6 +93,10 @@
       text-align: right;
       vertical-align: top;
       padding-top: 8mm;
+         color: var(--bleu);
+              font-size: 14px;
+            font-family: var(--font-nav);
+       font-weight: 120;
     }
 
   }
@@ -134,4 +154,54 @@
 
 .nav-decor {
   position: running(decor);
-}
+}
+
+
+
+/* borders */
+	.pagedjs_margin-top-left-corner-holder:before{
+		content: " ";
+		background: var(--vert);
+		width: 100%;
+		height: var(--border);
+		position: absolute;
+	}
+
+	.pagedjs_margin-left:before{
+		content: " ";
+		position: absolute;
+		top:0;
+		background: var(--bleu);
+		width: var(--border);
+		height: var(--pagedjs-height);
+		z-index: 2;
+	}
+
+	.pagedjs_right_page .pagedjs_margin-left:before{
+		content: none;
+	}
+
+	.pagedjs_margin-right:after{
+		content: " ";
+		position: absolute;
+		top:0;
+		right: 0;
+		background: var(--bleu);
+		width: var(--border);
+		height: var(--pagedjs-height);
+		z-index: 2;
+	}
+
+	.pagedjs_left_page .pagedjs_margin-right:after{
+		content: none;
+	}
+
+	.pagedjs_margin-bottom:after{
+		content: " ";
+		background: var(--rouge);
+		width: 100%;
+		height: var(--border);
+		position: absolute;
+		bottom: 0;
+		left: 0;
+	}

maquette-tests/assets/css/chapter-header.css

@@ -33,10 +33,10 @@
 }
 
 .chapter-header h2 {
-  font-family: 'Routed Gothic Wide';
+  font-weight: 160;
+    font-family: var(--font-ocr);
   line-height: 1.1;
   font-size: 36px;
-  font-weight: normal;
  
 
   
@@ -44,9 +44,11 @@
 
 
 .chapter-header .author {
-    font-family: 'Routed Gothic Wide';
+     font-weight: 100;
-     font-size: 36px;
+    font-family: var(--font-ocr);
-    margin-top: calc(var(--baseline)*6);
+  line-height: 1.1;
+  font-size: 30px;
+    margin-top: calc(var(--baseline)*1);
        margin-bottom: calc(var(--baseline)*2);
 
    /* background-color: black;

maquette-tests/assets/css/notes.css

@@ -1,17 +1,30 @@
-.following-note {
+.float-note {
     /* font-family: var(--font-notes); */
     font-size: var(--fs-notes);
-    line-height: 14px;
+    line-height: 12px;
     font-weight: 500;
 
     display: block;
     margin-top: calc(var(--baseline)*0.5);
     margin-bottom: calc(var(--baseline)*0.5);
 
+    float: left;
+    width: 60mm;
+    padding-right: 2ch;
+    position: relative;
+    left: -20mm;
+    margin-right: -20mm;
+
+    color: var(--vert);
+    text-align: right;
+    clear: both;
+
+    break-inside: avoid;
+
 
 }
 
-.container-following-note {
+.container-float-note {
     margin-left: 30%;
 }
 
@@ -21,8 +34,8 @@
 }
 
 
-.following-note_call,
+.float-note_call,
-.following-note_marker {
+.float-note_marker {
 
     &::before {
         content: "{"
@@ -37,14 +50,19 @@
     font-size: var(--fs-notes);
 }
 
-.following-note_call {
+.float-note_call {
     padding-left: 0.25ch;
     position: relative;
     top: -3px;
 }
 
 
-.following-note_marker {
+.float-note_marker {
-    position: absolute;
+   width: 100%;
-    left: 0;
+   display: flex;
-}
+   justify-content: flex-end;
+   justify-content: space-between;
+   /* text-align: right; */
+}
+
+

maquette-tests/assets/css/text.css

@@ -6,12 +6,13 @@
     orphans: 2;
     hyphens: 2;
 
+
   
 }
 
-.container-following-note + p,
+.container-float-note + p,
 p + p{
-    text-indent: 30%;
+    text-indent: 3ch;
     position: relative;
     /* text-indent: -6ch; */
  
@@ -59,7 +60,10 @@ h3, h4{
   /* padding-left: 1.5ch; */
    margin-top: calc(var(--baseline)*1.5);
     margin-bottom: calc(var(--baseline)*0.5);
-    padding-left: 30%;
+    /* padding-left: 30%; */
+
+    max-width: 26ch;
+    text-align: center;
 }
 
 h3::before,

maquette-tests/assets/fonts/JetBrains/stylesheet.css

@@ -0,0 +1,18 @@
+@font-face {
+    font-family: "JetBrains Mono";
+    src: url("JetBrainsMono[wght].ttf") format("truetype");
+    font-weight: 100 800;
+    font-style: normal;
+  }
+  
+  @font-face {
+    font-family: "JetBrains Mono";
+    src: url("JetBrainsMono-Italic[wght].ttf") format("truetype");
+    font-weight: 100 800;
+    font-style: italic;
+  }
+
+/* p {
+    font-family: "JetBrains Mono";
+    font-feature-settings: "calt" 1;
+  } */

maquette-tests/assets/fonts/OCR-X/stylesheet.css

@@ -0,0 +1,13 @@
+@font-face {
+    font-family: "OCR X";
+    src: url("OCR-XTrial-VariableVF.ttf") format("truetype");
+    font-weight: 10 220;
+    font-style: normal;
+  }
+  
+  @font-face {
+    font-family: "OCR X";
+    src: url("OCR-XTrial-VariableVF.woff2") format("woff2");
+    font-weight: 10 220;
+    font-style: normal;
+  }

maquette-tests/assets/fonts/Triplicate/stylesheet.css

@@ -0,0 +1,55 @@
+@font-face {
+    font-family: "Triplicate T3";
+    src: url("triplicate-t3.ttf") format("truetype");
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: "Triplicate T3";
+    src: url("triplicate-t3-italic.ttf") format("truetype");
+    font-weight: normal;
+    font-style: italic;
+}
+
+@font-face {
+    font-family: "Triplicate T3";
+    src: url("triplicate-t3-bold.ttf") format("truetype");
+    font-weight: bold;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: "Triplicate T3";
+    src: url("triplicate-t3-bold-italic.ttf") format("truetype");
+    font-weight: bold;
+    font-style: italic;
+}
+
+@font-face {
+    font-family: "Triplicate T4";
+    src: url("triplicate-t4.ttf") format("truetype");
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: "Triplicate T4";
+    src: url("triplicate-t4-italic.ttf") format("truetype");
+    font-weight: normal;
+    font-style: italic;
+}
+
+@font-face {
+    font-family: "Triplicate T4";
+    src: url("triplicate-t4-bold.ttf") format("truetype");
+    font-weight: bold;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: "Triplicate T4";
+    src: url("triplicate-t4-bold-italic.ttf") format("truetype");
+    font-weight: bold;
+    font-style: italic;
+}

maquette-tests/assets/layout-4/base/_var.scss

@@ -12,10 +12,10 @@
     // --note: 'Wagram Slab', serif;
     --title: 'HNoailles Times Triplex', sans-serif;
 
-    --red: #9B0000;
+    --rouge: #9B0000;
-    --green:#009B00;
+    --vert:#009B00;
-    --green-light:#009b0025;
+    --vert-light:#009b0025;
-    --blue:  #00009B;
+    --bleu:  #00009B;
 
 
 

maquette-tests/assets/layout-4/modules/_chapter-header.scss

@@ -23,7 +23,7 @@
     line-height: 1.1;
     font-family: var(--font);
       font-family: var(--mono);
-    color: var(--blue);
+    color: var(--bleu);
     margin-bottom: calc(var(--baseline)*1);
     text-align: left;
     font-weight: normal;

maquette-tests/assets/layout-4/modules/_notes.scss

@@ -18,7 +18,7 @@
     font-size: 9.5px;
     line-height: 1.2;
 
-    .body_note{
+    .float-note_body{
         padding-top: 5px;
     }
 

maquette-tests/assets/layout-4/modules/_text.scss

@@ -6,7 +6,7 @@
     hyphens: auto;
     hyphenate-limit-chars: 8 3;
     position: relative;
-    // color: var(--blue);
+    // color: var(--bleu);
 
     letter-spacing: 0.01rem;
  
@@ -16,7 +16,7 @@
     //     display: inline-block;
     //     width: 8px;
     //     height: 8px;
-    //     background-color: var(--blue);
+    //     background-color: var(--bleu);
     //     border-radius: 50%;
     //     margin-right: 1ch;
     // }
@@ -38,7 +38,7 @@ h3{
     // text-decoration: underline;
     font-family: var(--mono);
     text-transform: uppercase;
-     color: var(--blue);
+     color: var(--bleu);
       max-width: 18ch;
     //   margin-inline: auto;
       letter-spacing: 0.05rem;
@@ -52,7 +52,7 @@ h3{
     //     display: block;
     //     width: 8px;
     //     height: 8px;
-    //     border: 1px solid var(--blue);
+    //     border: 1px solid var(--bleu);
     //     border-radius: 50%;
     //     margin-right: 1ch;
     //     position: relative;
@@ -101,7 +101,7 @@ blockquote{
   
       
 
-//     .body_note{
+//     .float-note_body{
 //         display: inline;
 //         padding-right: 1ch;
 //         background-color: white;

maquette-tests/assets/layout-4/style.css

@@ -9,10 +9,10 @@
   --mono: 'Baskemo Sans', monospace;
   --sans: 'Routed Gothic', serif;
   --title: 'HNoailles Times Triplex', sans-serif;
-  --red: #9B0000;
+  --rouge: #9B0000;
-  --green:#009B00;
+  --vert:#009B00;
-  --green-light:#009b0025;
+  --vert-light:#009b0025;
-  --blue: #00009B;
+  --bleu: #00009B;
   --indent: 7mm;
   --font-size: 12px;
   --baseline: 18px;
@@ -340,7 +340,7 @@ body {
   font-weight: normal;
   font-family: var(--mono);
   text-transform: uppercase;
-  color: var(--blue);
+  color: var(--bleu);
   max-width: 18ch;
   letter-spacing: 0.05rem;
   color: black;
@@ -428,7 +428,7 @@ body {
   line-height: 1.1;
   font-family: var(--font);
   font-family: var(--mono);
-  color: var(--blue);
+  color: var(--bleu);
   margin-bottom: calc(var(--baseline) * 1);
   text-align: left;
   font-weight: normal;

maquette-tests/assets/layout-4/style.css.map

@@ -1 +1 @@
-{"version":3,"sources":["base/_type.scss","base/_var.scss","style.css","base/_body.scss","base/_layout.scss","base/_type-specimen.scss","modules/_text.scss","modules/_footnotes.scss","modules/_chapter-header.scss","modules/_item-decor.scss"],"names":[],"mappings":"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","file":"style.css"}
+{"version":3,"sources":["base/_type.scss","base/_var.scss","style.css","base/_body.scss","base/_layout.scss","base/_type-specimen.scss","modules/_text.scss","modules/_footnotes.scss","modules/_chapter-header.scss","modules/_item-decor.scss"],"names":[],"mappings":"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","file":"style.css"}

maquette-tests/csspageweaver/lib/paged.esm.js

@@ -26354,7 +26354,7 @@ var scripts = {
 	build: "rollup --config",
 	coverage: "nyc npm test",
 	coveralls: "nyc report --reporter=text-lcov | coveralls",
-	hydrogen: "node --trace-hydrogen --trace-phase=Z --trace-deopt --code-comments --hydrogen-track-positions --redirect-code-traces --redirect-code-traces-to=code.asm --trace_hydrogen_file=code.cfg --print-opt-code bin/parse --stat -o /dev/null",
+	hydrogen: "node --trace-hydrogen --trace-phase=Z --trace-deopt --code-comments --hydrogen-track-positions --rougeirect-code-traces --rougeirect-code-traces-to=code.asm --trace_hydrogen_file=code.cfg --print-opt-code bin/parse --stat -o /dev/null",
 	lint: "eslint data lib scripts test && node scripts/review-syntax-patch --lint && node scripts/update-docs --lint",
 	"lint-and-test": "npm run lint && npm test",
 	prepublishOnly: "npm run build",

maquette-tests/csspageweaver/manifest.json

@@ -7,17 +7,13 @@
                 "previewPage",
                 "reloadInPlace",
                 "fullPage",
-                "inlineNotes",
+                "inlineNotes"
-                "followingNotes"
             ],
     "pluginsParameters":{
         "inlineNotes": {
             "input": ".footnote-ref",
             "containerNotes": "#footnotes",
-            "newClass": "inline-note"
+            "newClass": "inline-note",
-        },
-        "followingNotes": {
-            "selector": ".inline-note",
             "reset": ".chapter"
         }
 

maquette-tests/csspageweaver/plugins/followingNotes/.gitignore

@@ -1 +0,0 @@
-.DS_Store

maquette-tests/csspageweaver/plugins/followingNotes/config.json

@@ -1,8 +0,0 @@
-{
-	"name": "FollowingNotes",
-	"description": "Create followingNotes with call & markers",
-	"author": ["Julie Blanc"],
-	"licence": "MIT",
-	"version": "1.0",
-	"hook": "followingNotes.js"
-}

maquette-tests/csspageweaver/plugins/followingNotes/followingNotes.js

@@ -1,220 +0,0 @@
-/**
- * @name FollowingNotes
- * @author Julie Blanc <contact@julie-blanc.fr>
- * @see { @link https://gitlab.com/csspageweaver/plugins/followingNotes/ }
- */
-
-import { Handler } from '/csspageweaver/lib/paged.esm.js';
-
-export default class followingNotes extends Handler {
-
-  constructor(chunker, polisher, caller) {
-    super(chunker, polisher, caller);
-    this.parameters = cssPageWeaver.features.followingNotes.parameters;
-    this.notesClass = this.parameters?.selector || ".inline-note";
-    this.newNotesClass = this.parameters?.newNotesClass || "following-note";
-    this.reset = this.parameters?.reset;
-    this.align = this.parameters?.align;
-    this.followingNoteOverflow = new Set();
-  }
-
-  beforeParsed(content) {
-
-    console.log("floatnotes");
-
-    let newNotesClass = this.newNotesClass;
-    resetCounter(content, this.reset, this.notesClass);
-    createCallandMarker(content, this.notesClass, newNotesClass);
-
-
-    let notes = content.querySelectorAll(this.notesClass);
-    notes.forEach(function (note) {
-      let paragraph = note.closest("p");
-      if (!paragraph) return;
-
-      let container = paragraph.nextElementSibling;
-      if (!container || !container.classList.contains("container-following-note")) {
-        container = document.createElement("div");
-        container.classList.add("container-following-note");
-        paragraph.after(container);
-      }
-
-      container.appendChild(note);
-    });
-
-
-  }
-
-
-
-}
-
-
-
-
-/// FUNCTIONS -----------------------------------------------------
-
-
-// RESET COUNTER
-
-function resetCounter(content, reset, notesClass){
-
-  if(reset && reset != ""){
-    const elements = content.querySelectorAll(reset + ", " + notesClass);
-    let resetEligible = false;
-    elements.forEach(element => {
-        if (element.matches(reset)) {
-            resetEligible = true;
-        } else if (resetEligible && element.matches(notesClass)) {
-            element.dataset.resetCounterFollowingNote = true;
-            resetEligible = false;
-        }
-    });
-  }
-
-}
-
-
-// CALL & MARKER
-function createCallandMarker(content, notesClass, newNotesClass){
-
-  let notes = content.querySelectorAll(notesClass);
-  let resetNum = 0;
-
-  notes.forEach(function (note, index) {
-
-      if (note.dataset.resetCounterFollowingNote === "true") {
-          resetNum = index;
-      }
-      let num = index + 1 - resetNum;
-
-      note.classList.add(newNotesClass);
-      note.dataset.counterNote = num;
-
-      // call
-      let ref_note = document.createElement('span');
-      ref_note.className = newNotesClass + "_call";
-      ref_note.dataset.counterNote = num;
-      ref_note.innerHTML = num;
-
-      // wrap preceding word + call in .wrapper__note-call
-      let wrapper = document.createElement('span');
-      wrapper.className = 'wrapper__note-call';
-
-      let prevSibling = note.previousSibling;
-      if (prevSibling && prevSibling.nodeType === Node.TEXT_NODE) {
-        let text = prevSibling.textContent;
-        let m = text.match(/^([\s\S]*\s)(\S+\s*)$/);
-        if (m) {
-          let before = m[1];
-          let extracted = m[2];
-
-          // Si le dernier mot extrait est uniquement », prendre aussi le mot d'avant
-          if (/^»\s*$/.test(extracted)) {
-            let m2 = before.trimEnd().match(/^([\s\S]*\s|)(\S+)$/);
-            if (m2) {
-              let spaceBetween = before.slice(m2[1].length + m2[2].length);
-              before = m2[1];
-              extracted = m2[2] + spaceBetween + extracted;
-            }
-          }
-
-          prevSibling.textContent = before;
-          wrapper.appendChild(document.createTextNode(extracted));
-        } else {
-          prevSibling.textContent = '';
-          wrapper.appendChild(document.createTextNode(text));
-        }
-      }
-
-      wrapper.appendChild(ref_note);
-      note.after(wrapper);
-
-      // marker + content note wrapped in body_note
-      let marker_note = document.createElement('span');
-      marker_note.className = newNotesClass + "_marker";
-      //marker_note.innerHTML = num + ". ";
-    marker_note.innerHTML = num;
-
-      let body_note = document.createElement('div');
-      body_note.className = 'body_note';
-      while (note.firstChild) {
-          body_note.appendChild(note.firstChild);
-      }
-      body_note.prepend(marker_note);
-      note.appendChild(body_note);
-
-  });
-
-  }
-
-
-
-
-// MARGINS
-
-function marginNoteTop(elem) {
-  let marginTop = parseInt(window.getComputedStyle(elem).marginTop, 10)
-  return marginTop;
-}
-
-function marginNoteBottom(elem) {
-  let marginBottom = parseInt(window.getComputedStyle(elem).marginBottom, 10)
-  return marginBottom;
-}
-
-function biggestMargin(a, b) {
-  let margin;
-  let marginBottom = marginNoteBottom(a);
-  let marginTop = marginNoteTop(b);
-  if (marginBottom > marginTop) {
-      margin = marginBottom;
-  } else {
-      margin = marginTop;
-  }
-  return margin;
-}
-
-
-
-function checkOverflownote(notesClass, pageElement, maxHeight, arrayOverflow, container) {
-  let notes = pageElement.querySelectorAll(notesClass);
-
-  let notesHeightAll = [];
-
-  for (let n = 0; n < notes.length; ++n) {
-
-      // Add height of the notes to array notesHeightAll
-      let noteHeight = notes[n].offsetHeight;
-      notesHeightAll.push(noteHeight);
-      // Add margins of the notes to array notesHeightAll
-      if (n >= 1) {
-          let margins = biggestMargin(notes[n - 1], notes[n]);
-          notesHeightAll.push(margins);
-      }
-  }
-
-  // If notes on page
-  if (notesHeightAll.length > 0) {
-
-      // Calculate if all notes fit on the page;
-      let reducer = (accumulator, currentValue) => accumulator + currentValue;
-      let allHeight = notesHeightAll.reduce(reducer);
-      let paddingTop = getComputedStyle(container).paddingTop;
-      let paddingContainer = parseInt(paddingTop);
-
-      let totalHeight = allHeight + paddingContainer;
-
-      if (totalHeight > maxHeight) {
-
-          let lastNote = notes[notes.length - 1];
-          arrayOverflow.add(lastNote);
-          lastNote.remove();
-
-          checkOverflownote(notesClass, pageElement, maxHeight, arrayOverflow, container);
-
-      }
-
-
-  }
-}

maquette-tests/csspageweaver/plugins/inlineNotes/inlineNotes.js

@@ -11,9 +11,12 @@ export default class inlineNotes extends Handler {
 
   constructor(chunker, polisher, caller) {
     super(chunker, polisher, caller);
-    this.input = cssPageWeaver.features.inlineNotes.parameters?.input || ".footnote-ref"; // ← CSS selector of the call element 
+    const params = cssPageWeaver.features.inlineNotes.parameters;
-    this.containerNotes = cssPageWeaver.features.inlineNotes.parameters?.containerNotes || "#footnotes"; // ← CSS selector of the container of the footnote
+    this.input = params?.input || ".footnote-ref"; // ← CSS selector of the call element
-    this.newClass = cssPageWeaver.features.inlineNotes.parameters?.newClass || "inline-note"; // ← Class of the span create for the note
+    this.containerNotes = params?.containerNotes || "#footnotes"; // ← CSS selector of the container of the footnote
+    this.newClass = params?.newClass || "inline-note"; // ← Class of the span create for the note
+    this.newNotesClass = params?.newNotesClass || "float-note";
+    this.reset = params?.reset;
   }
 
   beforeParsed(content) {
@@ -25,6 +28,10 @@ export default class inlineNotes extends Handler {
         type: this.newClass
     });
 
+    let notesClass = "." + this.newClass;
+    resetCounter(content, this.reset, notesClass);
+    createCallandMarker(content, notesClass, this.newNotesClass);
+
   }
 }
 
@@ -84,7 +91,7 @@ function createNotes(content, input, type){
           back.remove();
        }
       
-       let inline_note = document.createElement('span');
+       let inline_note = document.createElement('div');
        inline_note.className = type;
        let num = index + 1;
        inline_note.dataset.counterNote = num;
@@ -96,3 +103,105 @@ function createNotes(content, input, type){
 
    })
 }
+
+
+
+
+
+/// FUNCTIONS -----------------------------------------------------
+
+
+// RESET COUNTER
+
+function resetCounter(content, reset, notesClass){
+
+  if(reset && reset != ""){
+    const elements = content.querySelectorAll(reset + ", " + notesClass);
+    let resetEligible = false;
+    elements.forEach(element => {
+        if (element.matches(reset)) {
+            resetEligible = true;
+        } else if (resetEligible && element.matches(notesClass)) {
+            element.dataset.resetCounterFollowingNote = true;
+            resetEligible = false;
+        }
+    });
+  }
+
+}
+
+
+// CALL & MARKER
+function createCallandMarker(content, notesClass, newNotesClass){
+
+  let notes = content.querySelectorAll(notesClass);
+  let resetNum = 0;
+
+  notes.forEach(function (note, index) {
+
+      if (note.dataset.resetCounterFollowingNote === "true") {
+          resetNum = index;
+      }
+      let num = index + 1 - resetNum;
+
+      note.classList.remove(...note.classList);
+      note.classList.add(newNotesClass);
+      note.dataset.counterNote = num;
+
+      // call
+      let ref_note = document.createElement('span');
+      ref_note.className = newNotesClass + "_call";
+      ref_note.dataset.counterNote = num;
+      ref_note.innerHTML = num;
+
+      // wrap preceding word + call in .wrapper__note-call
+      let wrapper = document.createElement('span');
+      wrapper.className = 'wrapper__note-call';
+
+      let prevSibling = note.previousSibling;
+      if (prevSibling && prevSibling.nodeType === Node.TEXT_NODE) {
+        let text = prevSibling.textContent;
+        let m = text.match(/^([\s\S]*\s)(\S+\s*)$/);
+        if (m) {
+          let before = m[1];
+          let extracted = m[2];
+
+          // Si le dernier mot extrait est uniquement », prendre aussi le mot d'avant
+          if (/^»\s*$/.test(extracted)) {
+            let m2 = before.trimEnd().match(/^([\s\S]*\s|)(\S+)$/);
+            if (m2) {
+              let spaceBetween = before.slice(m2[1].length + m2[2].length);
+              before = m2[1];
+              extracted = m2[2] + spaceBetween + extracted;
+            }
+          }
+
+          prevSibling.textContent = before;
+          wrapper.appendChild(document.createTextNode(extracted));
+        } else {
+          prevSibling.textContent = '';
+          wrapper.appendChild(document.createTextNode(text));
+        }
+      }
+
+      wrapper.appendChild(ref_note);
+      note.before(wrapper);
+
+      // marker + content note wrapped in float-note_body
+      let marker_note = document.createElement('span');
+      marker_note.className = newNotesClass + "_marker";
+      //marker_note.innerHTML = num + ". ";
+    marker_note.innerHTML = num;
+
+      let noteBody = document.createElement('div');
+      noteBody.className = 'float-note_body';
+      while (note.firstChild) {
+          noteBody.appendChild(note.firstChild);
+      }
+      note.appendChild(marker_note);
+      note.appendChild(noteBody);
+
+  });
+
+  }
+

maquette-tests/csspageweaver/plugins/sidenotes/sidenotes.js

@@ -111,18 +111,18 @@ function createCallandMarker(content, notesClass, newNotesClass){
       ref_note.innerHTML = num;
       note.after(ref_note);
 
-      // marker + content note wrapped in body_note
+      // marker + content note wrapped in float-note_body
       let marker_note = document.createElement('span');
       marker_note.className = newNotesClass + "_marker";
       marker_note.innerHTML = num + ". ";
 
-      let body_note = document.createElement('div');
+      let noteBody = document.createElement('div');
-      body_note.className = 'body_note';
+      noteBody.className = 'float-note_body';
       while (note.firstChild) {
-          body_note.appendChild(note.firstChild);
+          noteBody.appendChild(note.firstChild);
       }
-      body_note.prepend(marker_note);
+      noteBody.prepend(marker_note);
-      note.appendChild(body_note);
+      note.appendChild(noteBody);
 
   });  
 

maquette-tests/index.html

@@ -27,6 +27,9 @@
     <link rel="stylesheet" type="text/css" href="/assets/fonts/BaskemoSans/stylesheet.css">
     <link rel="stylesheet" type="text/css" href="/assets/fonts/Bilzig/stylesheet.css">
     <link rel="stylesheet" type="text/css" href="/assets/fonts/DecorRound/stylesheet.css">
+    <link rel="stylesheet" type="text/css" href="/assets/fonts/JetBrains/stylesheet.css">
+    <link rel="stylesheet" type="text/css" href="/assets/fonts/OCR-X/stylesheet.css">
+    <link rel="stylesheet" type="text/css" href="/assets/fonts/Triplicate/stylesheet.css">
 
 </head>
 
@@ -37,7 +40,7 @@
         <h1>Décor 6 - Numérique</h1>
     </section>
 
-    <span class="nav-decor">D6cor</span>
+    <span class="nav-decor">Decor</span>
     <span class="nav-type">Essai</span>
     <span class="nav-author">Olivain Porry</span>
     <span class="nav-title">Un robot-poète ne&nbsp;nous fait toujours pas peur</span>
@@ -62,7 +65,7 @@
         <div class="chapter-header">
                         <p class="type">Essai</p>
                         <div class="hgroup">
-                            <h2><span>Un robot-poète ne&nbsp;nous fait toujours pas peur</span></h2>
+                            <h2><span>Un robot-poete ne&nbsp;nous fait toujours pas peur</span></h2>
                             <p class="author">Olivain Porry</p>
                         </div>