PublishingCSS:HD Bulletin 1: Difference between revisions
No edit summary |
No edit summary |
||
Line 22: | Line 22: | ||
size: 105mm 297mm; | size: 105mm 297mm; | ||
margin: 15mm 10mm 25mm 10mm; | margin: 15mm 10mm 25mm 10mm; | ||
bleed: | bleed: 3mm; | ||
background-color: white; | background-color: white; | ||
} | } | ||
@page:left { | @page:left { | ||
bleed-right: 0; | |||
@top-center { | @top-center { | ||
content: string(pubTitle); | content: string(pubTitle); | ||
Line 33: | Line 35: | ||
@page:right { | @page:right { | ||
bleed-left: 0; | |||
@top-center { | @top-center { | ||
content: string(articleTitle); | content: string(articleTitle); |
Revision as of 09:33, 13 June 2023
/*
- Pagedjs
- - Variables
- - Pagebreaks
- - Spreads
- Fonts
- Layouts
- General styling
*/
/*
*** PAGEDJS ***
*/
/*
* Pagedjs/paged media specific styles
*/
@page {
size: 105mm 297mm;
margin: 15mm 10mm 25mm 10mm;
bleed: 3mm;
background-color: white;
}
@page:left {
bleed-right: 0;
@top-center {
content: string(pubTitle);
}
}
@page:right {
bleed-left: 0;
@top-center {
content: string(articleTitle);
}
}
@page {
@bottom-center {
content: counter(page);
}
}
/*
* Setting variables
*/
h1 {
string-set: pubTitle content(text);
}
h2 {
counter-increment: countChapter;
string-set: articleTitle content(text);
counter-set: footnote-marker 0 footnote 0;
string-set: author "";
}
/* Move the footnotes to the footer */
span.footnote {
float: footnote;
}
/*
* Page breaks
*/
h1 {
page-break-before: left;
}
h2 {
page-break-before: right;
}
.empty-left-page {
page-break-before: left;
}
.full-spread-image-section {
page-break-before: left;
}
.full-page-image {
page-break-before: always;
}
.full-page-image.full-page-image-left {
page-break-before: left;
}
/*
* Spreads
*/
.full-page-image {
width: var(--pagedjs-width);
height: var(--pagedjs-height);
overflow: hidden;
left: calc(calc(var(--pagedjs-bleed-left) + var(--pagedjs-margin-left))*-1);
top: calc(calc(var(--pagedjs-bleed-top) + var(--pagedjs-margin-top))*-1);
position: absolute;
}
.full-page-image div {
width: calc(var(--pagedjs-width)*2 - var(--pagedjs-bleed-left) - var(--pagedjs-bleed-right));
height: var(--pagedjs-height);
display: flex;
justify-content: center;
align-items: flex-start;
}
/* compensate for bleeds */
.pagedjs_right_page .full-page-image div {
margin-left: calc( calc(-1 * var(--pagedjs-width)) + var(--pagedjs-bleed-left ) + var(--pagedjs-bleed-right ));
}
.full-page-image img {
width: 100%;
height: 100%;
object-fit: contain;
margin: 0 !important;
}
/* Position the caption */
.full-spread-image-section .full-page-image .full-spread-image-caption {
height: auto;
position: absolute;
display: block;
right: calc(calc(var(--pagedjs-bleed-right) + var(--pagedjs-margin-right)));
bottom: calc(var(--pagedjs-bleed-bottom) + var(--pagedjs-margin-bottom));
width: calc(var(--pagedjs-width) - var(--pagedjs-bleed-right) - var(--pagedjs-margin-right) - var(--pagedjs-bleed-left) - var(--pagedjs-margin-left));
}
/*
*** FONTS ***
* There's currently no way to add fonts through the wiki interface
* So either use fonts installed on your system or load them
* through a wiki2print publication plugin
*/
.font-authentic {
font-family: Authentic, sans-serif;
font-weight: 400;
}
.font-le-murmure {
font-family: le-murmure, sans-serif;
}
.font-notcouriersans {
font-family: Authentic, sans-serif;
font-weight: 400;
}
.font-solide-mirage-etroit {
font-family: SolideMirageEtroit, sans-serif
}
.font-solide-mirage-mono {
font-family: SolideMirageMono, sans-serif
}
.font-louise-regular {
font-family: Louise-Regular, sans-serif
}
.font-sligoil-micro {
font-family: Sligoil-Micro, sans-serif
}
.font-notoserif {
font-family: NotoSerifItalic-Micro, serif
}
/* General styling */