diverses améliorations de la mep
This commit is contained in:
@@ -12,6 +12,7 @@
|
|||||||
margin-bottom: 16mm;
|
margin-bottom: 16mm;
|
||||||
bleed: 6mm;
|
bleed: 6mm;
|
||||||
color: black;
|
color: black;
|
||||||
|
marks: crop;
|
||||||
}
|
}
|
||||||
|
|
||||||
@page:left {
|
@page:left {
|
||||||
@@ -127,6 +128,7 @@ h3 {
|
|||||||
.latour, .lampe {
|
.latour, .lampe {
|
||||||
font-family: 'Novel';
|
font-family: 'Novel';
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
|
margin-top: 20mm;
|
||||||
margin-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
|
margin-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
|
||||||
margin-right: -16mm;
|
margin-right: -16mm;
|
||||||
margin-bottom: 20mm;
|
margin-bottom: 20mm;
|
||||||
@@ -139,6 +141,12 @@ h3 {
|
|||||||
padding-top: 10mm;
|
padding-top: 10mm;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.encart-split {
|
||||||
|
position: absolute;
|
||||||
|
margin-left: calc(var(--pagedjs-pagebox-width) / var(--cols));
|
||||||
|
background-color: #fbf2e7;
|
||||||
|
}
|
||||||
|
|
||||||
.pagedjs_left_page .latour, .pagedjs_left_page .lampe {
|
.pagedjs_left_page .latour, .pagedjs_left_page .lampe {
|
||||||
padding-right: 10mm;
|
padding-right: 10mm;
|
||||||
width: 128.375mm;
|
width: 128.375mm;
|
||||||
@@ -168,7 +176,6 @@ h3 {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.lampe {
|
.lampe {
|
||||||
margin-top: 20mm;
|
|
||||||
padding-top: 3mm;
|
padding-top: 3mm;
|
||||||
padding-bottom: 3mm;
|
padding-bottom: 3mm;
|
||||||
}
|
}
|
||||||
@@ -183,7 +190,7 @@ img {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.fullpageimage {
|
.fullpageimage {
|
||||||
margin-top: -16mm;
|
margin-top: -22mm;
|
||||||
margin-left: -10mm;
|
margin-left: -10mm;
|
||||||
width: 171mm;
|
width: 171mm;
|
||||||
height: 230mm;
|
height: 230mm;
|
||||||
@@ -197,31 +204,37 @@ img {
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tripleimgs {
|
.tripleimgs,
|
||||||
|
.tripleimgs_bottom {
|
||||||
break-before: page;
|
break-before: page;
|
||||||
break-after: page
|
break-after: page
|
||||||
}
|
}
|
||||||
|
|
||||||
.tripleimgs img:nth-of-type(2) {
|
.tripleimgs img:nth-of-type(2),
|
||||||
|
.tripleimgs_bottom img:first-of-type {
|
||||||
width: calc(50% - 1mm);
|
width: calc(50% - 1mm);
|
||||||
margin-right: 2mm;
|
margin-right: 2mm;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tripleimgs img:last-of-type {
|
.tripleimgs img:last-of-type,
|
||||||
|
.tripleimgs_bottom img:nth-of-type(2) {
|
||||||
width: calc(50% - 1mm);
|
width: calc(50% - 1mm);
|
||||||
}
|
}
|
||||||
|
|
||||||
.tripleimgs2 {
|
.tripleimgs2,
|
||||||
|
.tripleimgs2_bottom {
|
||||||
break-before: page;
|
break-before: page;
|
||||||
break-after: page
|
break-after: page
|
||||||
}
|
}
|
||||||
|
|
||||||
.tripleimgs2 img:nth-of-type(2) {
|
.tripleimgs2 img:nth-of-type(2),
|
||||||
|
.tripleimgs2_bottom img:first-of-type {
|
||||||
width: calc(37.5% - 1mm);
|
width: calc(37.5% - 1mm);
|
||||||
margin-right: 2mm;
|
margin-right: 2mm;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tripleimgs2 img:last-of-type {
|
.tripleimgs2 img:last-of-type,
|
||||||
|
.tripleimgs2_bottom img:nth-of-type(2) {
|
||||||
width: calc(62.5% - 1mm);
|
width: calc(62.5% - 1mm);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -232,17 +245,42 @@ img {
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.imgfullspreadright {
|
||||||
|
break-before: left;
|
||||||
|
break-after: left;
|
||||||
|
width: 149mm;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
.imgfullspreadleft img {
|
.imgfullspreadleft img {
|
||||||
height: 198mm;
|
height: 198mm;
|
||||||
width: auto;
|
width: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.imgfullspreadright img {
|
||||||
|
height: 198mm;
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
.imgfullspreadleft-right {
|
.imgfullspreadleft-right {
|
||||||
width: 149mm;
|
width: 149mm;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin-left: -16mm;
|
margin-left: -16mm;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.imgfullspreadright-right {
|
||||||
|
width: 149mm;
|
||||||
|
margin-left: -8mm;
|
||||||
|
overflow: hidden;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.imgfullspreadright-right img {
|
||||||
|
height: 198mm;
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
.imgfullspreadleft-right img {
|
.imgfullspreadleft-right img {
|
||||||
height: 198mm;
|
height: 198mm;
|
||||||
width: auto;
|
width: auto;
|
||||||
|
|||||||
@@ -145,10 +145,10 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
// images collées en bas
|
// images collées en bas
|
||||||
let bottomImgs = document.getElementsByClassName('bottomimg');
|
let bottomImgs = document.querySelectorAll('.bottomimg, .tripleimgs_bottom, .tripleimgs2_bottom');
|
||||||
for (let i = 0; i < bottomImgs.length; i++) {
|
for (let i = 0; i < bottomImgs.length; i++) {
|
||||||
let page = bottomImgs[i].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode;
|
let page = bottomImgs[i].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode;
|
||||||
bottomImgs[i].style.transform = 'translateY(' + (page.getBoundingClientRect().bottom - bottomImgs[i].firstElementChild.getBoundingClientRect().bottom) + 'px)';
|
bottomImgs[i].style.transform = 'translateY(' + (page.getBoundingClientRect().bottom - bottomImgs[i].lastElementChild.getBoundingClientRect().bottom) + 'px)';
|
||||||
}
|
}
|
||||||
// éléments justifiés pas nécessaires
|
// éléments justifiés pas nécessaires
|
||||||
let justifiedSplitEl = document.querySelectorAll("[data-align-last-split-element='justify']");
|
let justifiedSplitEl = document.querySelectorAll("[data-align-last-split-element='justify']");
|
||||||
@@ -161,16 +161,70 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
// images fullspread
|
// images fullspread
|
||||||
let fullspreadEl = document.getElementsByClassName('imgfullspreadleft');
|
let fullspreadEl = document.querySelectorAll('.imgfullspreadleft, .imgfullspreadright');
|
||||||
for (let i = 0; i < fullspreadEl.length; i++) {
|
for (let i = 0; i < fullspreadEl.length; i++) {
|
||||||
let imgSrc = fullspreadEl[i].firstElementChild.getAttribute('src');
|
let imgSrc = fullspreadEl[i].firstElementChild.getAttribute('src');
|
||||||
let nextPage = fullspreadEl[i].closest('.pagedjs_page').nextElementSibling.querySelectorAll('.pagedjs_page_content');
|
let nextPage = fullspreadEl[i].closest('.pagedjs_page').nextElementSibling.querySelectorAll('.pagedjs_page_content');
|
||||||
let imgOverflowEl = document.createElement('div');
|
let imgOverflowEl = document.createElement('div');
|
||||||
imgOverflowEl.setAttribute('class', 'imgfullspreadleft-right');
|
if (fullspreadEl[i].classList.contains('imgfullspreadleft')) {
|
||||||
|
imgOverflowEl.setAttribute('class', 'imgfullspreadleft-right');
|
||||||
|
} else {
|
||||||
|
imgOverflowEl.setAttribute('class', 'imgfullspreadright-right');
|
||||||
|
}
|
||||||
let imgOverflow = document.createElement('img');
|
let imgOverflow = document.createElement('img');
|
||||||
imgOverflow.src = imgSrc;
|
imgOverflow.src = imgSrc;
|
||||||
imgOverflowEl.append(imgOverflow);
|
imgOverflowEl.append(imgOverflow);
|
||||||
nextPage[0].append(imgOverflowEl);
|
nextPage[0].append(imgOverflowEl);
|
||||||
|
if (fullspreadEl[i].classList.contains('imgfullspreadright')) {
|
||||||
|
let imgMargin = imgOverflowEl.getBoundingClientRect().right - fullspreadEl[i].firstElementChild.getBoundingClientRect().right;
|
||||||
|
fullspreadEl[i].firstElementChild.style.marginLeft = imgMargin + 'px';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// fullpage img page gauche
|
||||||
|
let fullPageImg = document.getElementsByClassName('fullpageimage');
|
||||||
|
for (let i = 0; i < fullPageImg.length; i++) {
|
||||||
|
if (fullPageImg[i].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode
|
||||||
|
.classList.contains('pagedjs_left_page')) {
|
||||||
|
fullPageImg[i].style.marginLeft = '-22mm';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// encarts bleed
|
||||||
|
let encarts = document.querySelectorAll('.latour, .lampe')
|
||||||
|
for (let i = 0; i < encarts.length; i++) {
|
||||||
|
if (encarts[i].parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode
|
||||||
|
.classList.contains('pagedjs_right_page')) {
|
||||||
|
encarts[i].style.marginRight = '-22mm';
|
||||||
|
encarts[i].style.paddingRight = '22mm';
|
||||||
|
}
|
||||||
|
if (encarts[i].hasAttribute('data-split-original')) {
|
||||||
|
let plainColor = document.createElement('div');
|
||||||
|
let plainHeight = encarts[i]
|
||||||
|
.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode
|
||||||
|
.getBoundingClientRect().bottom - encarts[i].getBoundingClientRect().bottom;
|
||||||
|
plainColor.setAttribute('class', 'encart-split');
|
||||||
|
if (encarts[i]
|
||||||
|
.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode
|
||||||
|
.classList.contains('pagedjs_right_page')) {
|
||||||
|
plainColor.style.width = "149mm";
|
||||||
|
} else {
|
||||||
|
plainColor.style.width = "129mm";
|
||||||
|
}
|
||||||
|
plainColor.style.height = plainHeight + "px";
|
||||||
|
encarts[i].parentNode.append(plainColor);
|
||||||
|
} else if (encarts[i].hasAttribute('data-split-from')) {
|
||||||
|
let plainColor = document.createElement('div');
|
||||||
|
plainColor.setAttribute('class', 'encart-split');
|
||||||
|
if (encarts[i]
|
||||||
|
.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode
|
||||||
|
.classList.contains('pagedjs_right_page')) {
|
||||||
|
plainColor.style.width = "149mm";
|
||||||
|
} else {
|
||||||
|
plainColor.style.width = "129mm";
|
||||||
|
}
|
||||||
|
plainColor.style.height = "22mm";
|
||||||
|
plainColor.style.top = "-22mm";
|
||||||
|
encarts[i].parentNode.prepend(plainColor);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user