Julie/walter-boente_book-collection
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

grid column

Browse source
This commit is contained in:
Julie Blanc 2026-04-16 09:42:55 +02:00
parent 030e27bfac
commit fa738ed605
22 changed files with 183 additions and 630 deletions
Download patch file Download diff file Expand all files Collapse all files

31
css/modules/_layout.scss
View file

@ -1,13 +1,18 @@
$width: 176mm;
$height: 240mm;
$top: 6mm;
$bottom: 20mm;
$inside: 12mm;
$outside: 6mm;
$top: 10mm;
$bottom: 14mm;
$inside: 20mm;
$outside: 14mm;
$content-h: calc($height - $top - $bottom - 1mm);
$content-w: calc($width - $inside - $outside);
$gap: 4mm;
$indent: 10mm;
$unit: calc($content-w/7);
:root{
--unit: #{$unit};
}
@media print {
@ -23,9 +28,7 @@ $indent: 10mm;
margin-left: $outside;
margin-right: $inside;
// background-image: url("/images/layout-2_3.png");
// background-size: 100% 100%;
@bottom-left {
content: counter(page);
@ -46,6 +49,10 @@ $indent: 10mm;
margin-left: $inside;
margin-right: $outside;
background-image: url("/images/layout-1_20.png");
background-size: 100% 100%;
@bottom-left {
content: string(chapterCount);
font-family: var(--font-sans);
@ -141,11 +148,11 @@ $indent: 10mm;
}
#section__content{
columns: 2;
column-gap: $gap;
column-fill: auto;
}
// #section__content{
// columns: 2;
// column-gap: $gap;
// column-fill: auto;
// }
// Title chapter

8
css/modules/_num-paragraph.scss
View file

@ -4,18 +4,12 @@
ol[type="1"]{
list-style-type: none;
position: relative;
break-after: avoid;
width: $indent;
position: absolute;
display: flex;
align-items: center;
justify-content: center;
left: calc(var(--unit)*2);
&::after{
content: attr(start);
display: block;
position: absolute;
font-size: var(--fs-small);
opacity: 0.5;
}

7
css/modules/_text.scss
View file

@ -22,8 +22,13 @@ p{
text-align: justify;
orphans: 2;
widows: 2;
margin-left: $indent;
position: relative;
top: -2px;
// margin-left: $indent;
// padding-left: $indent*0.2;
padding-left: calc(var(--unit)*3);
}
p, li{

72
css/style.css
View file

@ -31,15 +31,19 @@ body {
line-height: var(--baseline);
}
:root {
--unit: 20.2857142857mm;
}
@media print {
@page {
size: 176mm 240mm;
margin-top: 6mm;
margin-bottom: 20mm;
margin-top: 10mm;
margin-bottom: 14mm;
}
@page :left {
margin-left: 6mm;
margin-right: 12mm;
margin-left: 14mm;
margin-right: 20mm;
@bottom-left {
content: counter(page);
font-family: var(--font-sans);
@ -55,8 +59,10 @@ body {
}
}
@page :right {
margin-left: 12mm;
margin-right: 6mm;
margin-left: 20mm;
margin-right: 14mm;
background-image: url("/images/layout-1_20.png");
background-size: 100% 100%;
@bottom-left {
content: string(chapterCount);
font-family: var(--font-sans);
@ -178,8 +184,8 @@ body {
}
}
@page chapter {
margin-left: 6mm;
margin-right: 6mm;
margin-left: 14mm;
margin-right: 14mm;
@top-left-corner {
content: none;
}
@ -240,15 +246,6 @@ body {
break-before: page;
}
#section__content {
-moz-columns: 2;
columns: 2;
-moz-column-gap: 4mm;
column-gap: 4mm;
-moz-column-fill: auto;
column-fill: auto;
}
#section__content h1 {
-moz-column-break-before: left;
break-before: left;
@ -287,7 +284,9 @@ p {
text-align: justify;
orphans: 2;
widows: 2;
margin-left: 10mm;
position: relative;
top: -2px;
padding-left: calc(var(--unit) * 3);
}
p, li {
@ -335,19 +334,14 @@ ul {
ol[type="1"] {
list-style-type: none;
position: relative;
-moz-column-break-after: avoid;
break-after: avoid;
width: 10mm;
position: absolute;
display: flex;
align-items: center;
justify-content: center;
left: calc(var(--unit) * 2);
}
ol[type="1"]::after {
content: attr(start);
display: block;
position: absolute;
font-size: var(--fs-small);
opacity: 0.5;
}
@ -358,13 +352,13 @@ ol[type="1"].ol-clone {
-moz-column-break-after: avoid;
break-after: avoid;
top: 0;
left: 81mm;
left: 73mm;
}
#section__content h1 {
-moz-column-span: all;
column-span: all;
height: 213mm;
height: 215mm;
}
#section__content h2::before, #section__content h3::before, #section__content h4::before, #section__content h5::before, #section__content h6::before {
content: attr(data-counter);
@ -499,32 +493,6 @@ ol[type="1"].ol-clone {
color: red;
}
.container-following-note {
font-family: var(--font-sans);
font-size: var(--fs-small);
line-height: calc(var(--baseline) * 0.75);
position: relative;
margin-top: 2px;
hyphens: auto;
hyphenate-limit-chars: 7 3 4;
hyphenate-limit-lines: 2;
hyphenate-limit-zone: 8%;
word-spacing: -0.004em;
text-align: justify;
}
.following-note_marker::after {
content: ". ";
}
.following-note_call {
font-family: var(--font-sans);
font-size: var(--fs-small);
line-height: 1;
position: relative;
top: -4px;
}
#toc_container {
-moz-column-break-before: page;
break-before: page;

2
css/style.css.map
View file

@ -1 +1 @@
{"version":3,"sources":["style.css","modules/_var.scss","modules/_init.scss","modules/_layout.scss","modules/_text.scss","modules/_num-paragraph.scss","modules/_titles.scss","modules/_list-of-abbr.scss","modules/_followingNotes.scss","modules/_toc.scss"],"names":[],"mappings":"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","file":"style.css"}
{"version":3,"sources":["style.css","modules/_var.scss","modules/_init.scss","modules/_layout.scss","modules/_text.scss","modules/_num-paragraph.scss","modules/_titles.scss","modules/_list-of-abbr.scss","modules/_toc.scss"],"names":[],"mappings":"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","file":"style.css"}

2
css/style.scss
View file

@ -6,5 +6,5 @@
@import 'modules/num-paragraph';
@import 'modules/titles';
@import 'modules/list-of-abbr';
@import 'modules/followingNotes';
// @import 'modules/followingNotes';
@import 'modules/toc';

14
csspageweaver/manifest.json
View file

@ -1,12 +1,10 @@
{
"plugins": [
"baseline",
"grid",
"gridColumn",
"marginBox",
"imposition","spread","previewPage","reloadInPlace",
"inlineNotes",
"followingNotes",
"tableOfContent"
"inlineNotes"
],
"pluginsParameters":{},
"css": [
@ -18,10 +16,6 @@
"containerNotes": "#footnotes",
"newClass": "inline-note"
},
"followingNotes": {
"selector": ".inline-note",
"reset": ".chapter"
},
"tableOfContent": {
"tocContainer": "#toc_container",
"tocTitles": ["#section__content h1", "#section__content h2", "h3", "h4", "h5", "h6"]
@ -29,9 +23,7 @@
},
"hook": [
"/js/counters.js",
"/js/these.js",
"/js/snapToBaseline.js",
"/js/numParagraph.js"
"/js/these.js"
]
}

8
csspageweaver/plugins/followingNotes/config.json
View file

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

244
csspageweaver/plugins/followingNotes/followingNotes.js
View file

@ -1,244 +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) {
let newNotesClass = this.newNotesClass;
resetCounter(content, this.reset, this.notesClass);
createCallandMarker(content, this.notesClass, newNotesClass);
const containerMap = new Map();
let notes = content.querySelectorAll(this.notesClass);
notes.forEach(function (note) {
let paragraph = note.closest("p");
if (!paragraph) return;
// Remonter au niveau direct de #section__content (ignorer blockquote et autres conteneurs)
const sectionContent = note.closest('#section__content') || content;
let topLevel = paragraph;
while (topLevel.parentElement && topLevel.parentElement !== sectionContent) {
topLevel = topLevel.parentElement;
}
// Find next boundary: heading or ol[type="1"], au niveau de #section__content
let boundary = null;
let sibling = topLevel.nextElementSibling;
while (sibling) {
if (sibling.matches('h1, h2, h3, h4, h5, h6, ol[type="1"]')) {
boundary = sibling;
break;
}
sibling = sibling.nextElementSibling;
}
const mapKey = boundary || sectionContent;
if (!containerMap.has(mapKey)) {
let container = document.createElement("div");
container.classList.add("container-following-note");
if (boundary) {
boundary.before(container);
} else {
sectionContent.appendChild(container);
}
containerMap.set(mapKey, container);
}
containerMap.get(mapKey).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);
}
}
}

1
csspageweaver/plugins/grid/.gitignore vendored
View file

@ -1 +0,0 @@
.DS_Store

14
csspageweaver/plugins/grid/config.json
View file

@ -1,14 +0,0 @@
{
"name": "Grid",
"description": "",
"version": "1.0",
"ui": {
"title": "Squared grid",
"description": "This Toogle a squared grid",
"template": "template.html",
"toggle": true
},
"stylesheet": "grid.css",
"script": "grid-ui.js",
"hook": "grid-hook.js"
}

17
csspageweaver/plugins/grid/grid-hook.js
View file

@ -1,17 +0,0 @@
/**
* @name Grid
* @author Julie Blanc <contact@julie-blanc.fr>
* @see { @link https://gitlab.com/csspageweaver/plugins/grid/ }
*/
import { Handler } from '/csspageweaver/lib/paged.esm.js';
export default class GridPage extends Handler {
constructor(chunker, polisher, caller) {
super(chunker, polisher, caller);
}
}

115
csspageweaver/plugins/grid/grid-ui.js
View file

@ -1,115 +0,0 @@
/**
* @name Grid
* @author Julie Blanc <contact@julie-blanc.fr>
* @see { @link https://gitlab.com/csspageweaver/plugins/grid/ }
*/
export default function gridEvents(){
let body = cssPageWeaver.ui.body;
let fileTitle = cssPageWeaver.docTitle;
let parameters = cssPageWeaver.features.grid.parameters || {};
let isParametersSet = Object.keys(parameters).length > 0;
let grid = {};
// valeur par défaut
grid.default = {
toggle: 'no-grid',
spacing: 56,
steps: 5,
positionX: 28,
positionY: 0
};
grid.toggle = {};
grid.toggle.input = cssPageWeaver.ui.grid.toggleInput;
grid.toggle.label = cssPageWeaver.ui.grid.toggleLabel;
grid.spacing = {};
grid.spacing.value = parameters.spacing || grid.default.spacing;
grid.spacing.input = document.querySelector('#spacing-grid');
grid.steps = {};
grid.steps.value = parameters.steps || grid.default.steps;
grid.steps.input = document.querySelector('#steps-grid');
grid.positionX = {};
grid.positionX.value = parameters.positionX || grid.default.positionX;
grid.positionX.input = document.querySelector('#position-x-grid');
grid.positionY = {};
grid.positionY.value = parameters.positionY || grid.default.positionY;
grid.positionY.input = document.querySelector('#position-y-grid');
/* Récupération de la session précédente */
grid.toggle.value = localStorage.getItem('gridToggle_' + fileTitle) || grid.default.toggle;
grid.spacing.value = localStorage.getItem('gridSpacing_' + fileTitle) || grid.spacing.value;
grid.steps.value = localStorage.getItem('gridSteps_' + fileTitle) || grid.steps.value;
grid.positionX.value = localStorage.getItem('gridPositionX_' + fileTitle) || grid.positionX.value;
grid.positionY.value = localStorage.getItem('gridPositionY_' + fileTitle) || grid.positionY.value;
/* DOM edit */
if(grid.toggle.value === "grid"){
body.classList.add('grid'); // on indique qu'il y a la grille
grid.toggle.input.checked = true;
} else {
body.classList.remove('grid'); // grille désactivée
grid.toggle.input.checked = false;
}
/* Set grid values on load */
grid.spacing.input.value = grid.spacing.value;
document.documentElement.style.setProperty('--grid-spacing', grid.spacing.value + 'px');
grid.steps.input.value = grid.steps.value;
document.documentElement.style.setProperty('--steps', grid.steps.value);
grid.positionX.input.value = grid.positionX.value;
document.documentElement.style.setProperty('--grid-position-x', grid.positionX.value + 'px');
grid.positionY.input.value = grid.positionY.value;
document.documentElement.style.setProperty('--grid-position-y', grid.positionY.value + 'px');
/* Event listeners */
/* Toggle event */
grid.toggle.input.addEventListener("input", (e) => {
if(e.target.checked){
body.classList.add('grid'); // grille activée
localStorage.setItem('gridToggle_' + fileTitle, 'grid');
} else {
body.classList.remove('grid'); // grille désactivée
localStorage.setItem('gridToggle_' + fileTitle, 'no-grid');
}
});
/* Change grid spacing on input */
document.querySelector("#spacing-grid").addEventListener("input", (e) => {
grid.spacing.value = e.target.value;
document.documentElement.style.setProperty('--grid-spacing', grid.spacing.value + 'px');
localStorage.setItem('gridSpacing_' + fileTitle, grid.spacing.value);
});
/* Change grid steps on input */
document.querySelector("#steps-grid").addEventListener("input", (e) => {
grid.steps.value = e.target.value;
document.documentElement.style.setProperty('--steps', grid.steps.value);
localStorage.setItem('gridSteps_' + fileTitle, grid.steps.value);
});
/* Change grid position X on input */
document.querySelector("#position-x-grid").addEventListener("input", (e) => {
grid.positionX.value = e.target.value;
document.documentElement.style.setProperty('--grid-position-x', grid.positionX.value + 'px');
localStorage.setItem('gridPositionX_' + fileTitle, grid.positionX.value);
});
/* Change grid position Y on input */
document.querySelector("#position-y-grid").addEventListener("input", (e) => {
grid.positionY.value = e.target.value;
document.documentElement.style.setProperty('--grid-position-y', grid.positionY.value + 'px');
localStorage.setItem('gridPositionY_' + fileTitle, grid.positionY.value);
});
}

124
csspageweaver/plugins/grid/grid.css
View file

@ -1,124 +0,0 @@
:root {
--grid-bold: #bfbfbf;
--grid-light: #efefef;
--grid-spacing: 56px;
--steps: 5;
--grid-position-x: 28px;
--grid-position-y: 0px;
--grid-subdivisions: calc(var(--grid-spacing)/var(--steps));
}
@media screen{
body.grid .pagedjs_sheet {
z-index: -1;
background-image:
/* Traits bold */
repeating-linear-gradient(
90deg,
var(--grid-bold) 0 1px,
transparent 1px var(--grid-spacing)
),
repeating-linear-gradient(
0deg,
var(--grid-bold) 0 1px,
transparent 1px var(--grid-spacing)
),
/* Traits fins (3 traits → 4 carrés) */
repeating-linear-gradient(
90deg,
var(--grid-light) 0 1px,
transparent 1px var(--grid-subdivisions)
),
repeating-linear-gradient(
0deg,
var(--grid-light) 0 1px,
transparent 1px var(--grid-subdivisions)
);
background-position:
var(--grid-position-x) var(--grid-position-y),
var(--grid-position-x) var(--grid-position-y),
var(--grid-position-x) var(--grid-position-y),
var(--grid-position-x) var(--grid-position-y);
}
.grid-page{
--nbr-columns: 8;
width: var(--pagedjs-pagebox-width);
height: var(--pagedjs-pagebox-height);
position: absolute;
top: 0;
left: 0;
display: grid;
grid-template-columns: repeat(var(--nbr-columns), calc(100%/var(--nbr-columns)));
box-shadow: 1px 0px 0px 0px var(--grid-color);
--grid-color: magenta;
z-index: -1;
}
.pagedjs_right_page .grid-page{
padding-left: var(--pagedjs-margin-left);
padding-right: var(--pagedjs-margin-right);
}
.pagedjs_left_page .grid-page{
padding-left: var(--pagedjs-margin-left);
padding-right: var(--pagedjs-margin-right);
}
.grid-page .grid-column{
box-shadow: 1px 0px 0px 0px var(--grid-color);
grid-row: 1/end;
width: 100%;
justify-self: right;
}
.grid-column-0{
grid-column: 1;
box-shadow: -1px 0px 0px 0px var(--grid-color)!important;
justify-self: left;
}
.grid-column-1{ grid-column: 1; }
.grid-column-2{ grid-column: 2; }
.grid-column-3{ grid-column: 3; }
.grid-column-4{ grid-column: 4; }
.grid-column-5{ grid-column: 5; }
.grid-column-6{ grid-column: 6; }
.grid-column-7{ grid-column: 7; }
.grid-column-8{ grid-column: 8; }
.grid-column-9{ grid-column: 9; }
.grid-column-10{ grid-column: 10; }
.grid-column-11{ grid-column: 11; }
.grid-column-12{ grid-column: 12; }
}
.no-grid .grid-page{
display: none;
}

16
csspageweaver/plugins/grid/template.html
View file

@ -1,16 +0,0 @@
<div class="panel-group-values">
<label for="spacing-grid">Spacing (px)</label>
<input type="number" id="spacing-grid" name="spacing-grid" min="1" max="200" value="56">
</div>
<div class="panel-group-values">
<label for="steps-grid">Steps</label>
<input type="number" id="steps-grid" name="steps-grid" min="1" max="20" value="5">
</div>
<div class="panel-group-values">
<label for="position-x-grid">Position X (px)</label>
<input type="number" id="position-x-grid" name="position-x-grid" value="28">
</div>
<div class="panel-group-values">
<label for="position-y-grid">Position Y (px)</label>
<input type="number" id="position-y-grid" name="position-y-grid" value="0">
</div>

0
csspageweaver/plugins/followingNotes/.gitignore → csspageweaver/plugins/gridColumn/.gitignore vendored
View file

0
csspageweaver/plugins/grid/README.md → csspageweaver/plugins/gridColumn/README.md
View file

13
csspageweaver/plugins/gridColumn/config.json Normal file
View file

@ -0,0 +1,13 @@
{
"name": "Column grid",
"description": "",
"version": "1.0",
"ui": {
"title": "Column grid",
"description": "This Toogle a column grid",
"template": "template.html",
"toggle": true
},
"stylesheet": "grid.css",
"script": "grid-ui.js"
}

73
csspageweaver/plugins/gridColumn/grid-ui.js Normal file
View file

@ -0,0 +1,73 @@
/**
* @name Grid
* @author Julie Blanc <contact@julie-blanc.fr>
* @see { @link https://gitlab.com/csspageweaver/plugins/grid/ }
*/
export default function gridEvents(id){
let body = cssPageWeaver.ui.body;
let fileTitle = cssPageWeaver.docTitle;
let parameters = cssPageWeaver.features[id].parameters || {};
let isParametersSet = Object.keys(parameters).length > 0;
let grid = {};
// valeur par défaut
grid.default = {
steps: 7,
};
grid.toggle = {};
grid.toggle.value = localStorage.getItem('gridColToggle_' + fileTitle) || 'no-grid-col';
grid.toggle.input = document.querySelector(`#${id}-toggle`);
grid.steps = {};
grid.steps.value = parameters.steps || grid.default.steps;
grid.steps.input = document.querySelector('#steps-grid-col');
/* Récupération de la session précédente si elle existe */
grid.steps.value = localStorage.getItem('gridColSteps_' + fileTitle) || grid.steps.value;
grid.steps.input.value = grid.steps.value;
document.documentElement.style.setProperty('--grid-col-steps', grid.steps.value);
/* DOM edit */
if(grid.toggle.value === "grid-col"){
body.classList.add('grid-col'); // on indique qu'il y a la grille
grid.toggle.input.checked = true;
} else {
body.classList.remove('grid-col'); // grille désactivée
grid.toggle.input.checked = false;
}
/* Toggle event */
grid.toggle.input.addEventListener("input", (e) => {
if(e.target.checked){
body.classList.add('grid-col'); // grille activée
localStorage.setItem('gridColToggle_' + fileTitle, 'grid-col');
} else {
body.classList.remove('grid-col'); // grille désactivée
localStorage.setItem('gridColToggle_' + fileTitle, 'no-grid-col');
}
});
/* Change grid steps on input */
document.querySelector("#steps-grid-col").addEventListener("input", (e) => {
grid.steps.value = e.target.value;
document.documentElement.style.setProperty('--grid-col-steps', grid.steps.value);
localStorage.setItem('gridColSteps_' + fileTitle, grid.steps.value);
});
}

36
csspageweaver/plugins/gridColumn/grid.css Normal file
View file

@ -0,0 +1,36 @@
:root {
--grid-col-color: #ee33d2;
--grid-light: #efefef;
--grid-spacing: 56px;
--steps: 5;
--grid-position-x: 28px;
--grid-position-y: 0px;
--grid-subdivisions: calc(var(--grid-spacing)/var(--steps));
}
@media screen{
body.grid-col .pagedjs_area {
z-index: -1;
box-shadow: 0px 0px 1px 0px var(--grid-col-color);
background-image: repeating-linear-gradient(to right, var(--grid-col-color), var(--grid-col-color) 0.5px, transparent 0.5px, transparent);
background-size: calc(100%/var(--grid-col-steps));
}
}

4
csspageweaver/plugins/gridColumn/template.html Normal file
View file

@ -0,0 +1,4 @@
<div class="panel-group-values">
<label for="steps-grid-col">Steps</label>
<input type="number" id="steps-grid-col" name="steps-grid" min="1" max="22" value="6">
</div>

12
js/snapToBaseline.js
View file

@ -9,12 +9,12 @@ export default class snapToBaseline extends Handler {
beforeParsed(content){
this.baseline = parseFloat(getComputedStyle(document.documentElement).getPropertyValue('--baseline').trim());
content.querySelectorAll('blockquote').forEach((bq) => {
const prev = bq.previousElementSibling;
if (!prev || prev.nodeName !== 'P') {
// bq.style.color = 'red';
}
});
// content.querySelectorAll('blockquote').forEach((bq) => {
// const prev = bq.previousElementSibling;
// if (!prev || prev.nodeName !== 'P') {
// // bq.style.color = 'red';
// }
// });
}
renderNode(node, sourceNode){