Skip to content

Printable cover edits #665

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
gesa wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

Printable cover edits #665

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
65 changes: 30 additions & 35 deletions css/print.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -135,55 +135,40 @@
}
}

@page :first, :nth(2) {
margin: 0;

@top-left {
content: none;
}

@top-right {
content: none;
}

@bottom-left {
content: none;
}

@bottom-right {
content: none;
}
}

@page toc, copyright, intro {
--page-number-style: lower-roman;
}

@page :blank {
@bottom-left {
content: none;
}
@page front-cover {
background-image: url('../img/print-front-cover.svg');
margin: 0;

@bottom-right {
content: none;
}
}

@page front-cover {
background-image: url('../img/print-front-cover.svg');
}

@page inside-cover {
background-image: url('../img/print-inside-cover.svg');
}

@page front-cover, inside-cover {
background-color: transparent;
background-position: center;
background-position: top center;
background-repeat: no-repeat;
margin: 0;
padding: 0;
page-break-after: always;

@top-left {
content: none;
}

@top-right {
content: none;
}

@bottom-left {
content: none;
}
}

html, body {
Expand Down Expand Up @@ -495,7 +480,7 @@ emu-figure img {
}

#toc > h2::after {
content: 'page';
content: 'Page';
float: right;
font-size: 10pt;
text-align: right;
Expand Down Expand Up @@ -559,11 +544,12 @@ a[data-print-href]::after {
width: auto;
}

emu-annex > h1 {
#spec-container > emu-annex > h1 {
font-size: 14pt;
text-align: center;
}

emu-annex > h1 span {
#spec-container > emu-annex > h1 span {
display: block;
}

Expand All @@ -588,7 +574,6 @@ emu-annex > h1 .secnum {
page: front-cover;
position: relative;
width: 210mm;
height: 297mm;
}

#front-cover h1 {
Expand Down Expand Up @@ -642,6 +627,16 @@ h1.version {
page: inside-cover;
}

#back-cover {
float: bottom;
page: back-cover;
}

#back-cover hr {
border-width: 0.25pt;
margin: 0.75pt auto;
}

#toc {
page: toc;
counter-reset: page 1;
Expand Down
125 changes: 121 additions & 4 deletions img/print-front-cover.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
96 changes: 52 additions & 44 deletions img/print-inside-cover.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 11 additions & 2 deletions src/Spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -619,7 +619,6 @@ export default class Spec {
// front cover
const frontCover = document.createElement('div');

frontCover.classList.add('full-page-svg');
frontCover.setAttribute('id', 'front-cover');

const versionNode = this.doc.querySelector('h1.version');
Expand All @@ -634,10 +633,20 @@ export default class Spec {
// inside cover
const insideCover = document.createElement('div');

insideCover.classList.add('full-page-svg');
insideCover.setAttribute('id', 'inside-cover');

frontCover.after(insideCover);

// back cover
const backCover = document.createElement('div');

backCover.setAttribute('id', 'back-cover');
backCover.append(
document.createElement('hr'),
document.createElement('hr'),
document.createElement('hr'),
);
wrapper.after(backCover);
}

let commonEles: HTMLElement[] = [];
Expand Down
65 changes: 30 additions & 35 deletions test/baselines/generated-reference/assets-inline.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3387,55 +3387,40 @@
}
}

@page :first, :nth(2) {
margin: 0;

@top-left {
content: none;
}

@top-right {
content: none;
}

@bottom-left {
content: none;
}

@bottom-right {
content: none;
}
}

@page toc, copyright, intro {
--page-number-style: lower-roman;
}

@page :blank {
@bottom-left {
content: none;
}
@page front-cover {
background-image: url('../img/print-front-cover.svg');
margin: 0;

@bottom-right {
content: none;
}
}

@page front-cover {
background-image: url('../img/print-front-cover.svg');
}

@page inside-cover {
background-image: url('../img/print-inside-cover.svg');
}

@page front-cover, inside-cover {
background-color: transparent;
background-position: center;
background-position: top center;
background-repeat: no-repeat;
margin: 0;
padding: 0;
page-break-after: always;

@top-left {
content: none;
}

@top-right {
content: none;
}

@bottom-left {
content: none;
}
}

html, body {
Expand Down Expand Up @@ -3747,7 +3732,7 @@
}

#toc > h2::after {
content: 'page';
content: 'Page';
float: right;
font-size: 10pt;
text-align: right;
Expand Down Expand Up @@ -3811,11 +3796,12 @@
width: auto;
}

emu-annex > h1 {
#spec-container > emu-annex > h1 {
font-size: 14pt;
text-align: center;
}

emu-annex > h1 span {
#spec-container > emu-annex > h1 span {
display: block;
}

Expand All @@ -3840,7 +3826,6 @@
page: front-cover;
position: relative;
width: 210mm;
height: 297mm;
}

#front-cover h1 {
Expand Down Expand Up @@ -3894,6 +3879,16 @@
page: inside-cover;
}

#back-cover {
float: bottom;
page: back-cover;
}

#back-cover hr {
border-width: 0.25pt;
margin: 0.75pt auto;
}

#toc {
page: toc;
counter-reset: page 1;
Expand Down
4 changes: 2 additions & 2 deletions test/baselines/generated-reference/clauses.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<!doctype html>
<head><meta name="viewport" content="width=device-width, initial-scale=1"><meta charset="utf-8"><title>Test Doc</title></head><body class=" oldtoc"><div class="full-page-svg" id="front-cover"><h1 class="title">Test Doc</h1></div><div class="full-page-svg" id="inside-cover"></div><div id="spec-container">
<head><meta name="viewport" content="width=device-width, initial-scale=1"><meta charset="utf-8"><title>Test Doc</title></head><body class=" oldtoc"><div id="front-cover"><h1 class="title">Test Doc</h1></div><div id="inside-cover"></div><div id="spec-container">
<div id="toc"><h2>Contents</h2><ol class="toc"><li><a href="#sec-intro" title="Intro">Intro</a><ol class="toc"><li><a href="#sec-intro2" title="Sub Intro">Sub Intro</a></li></ol></li><li><a href="#sec-clause" title="Clause Foo(a, b)"><span class="secnum">1</span> Clause Foo(<var>a</var>, <var>b</var>)</a><ol class="toc"><li><a href="#Foo" title="Sub Clause"><span class="secnum">1.1</span> Sub Clause</a></li></ol></li><li><a href="#sec-number" title="Explicit number"><span class="secnum">7</span> Explicit number</a><ol class="toc"><li><a href="#sec-number1" title="Automatic number inside explicit number"><span class="secnum">7.1</span> Automatic number inside explicit number</a></li><li><a href="#sec-number2" title="Nested explicit number"><span class="secnum">7.4</span> Nested explicit number</a></li><li><a href="#sec-number3" title="Automatic number after explicit number"><span class="secnum">7.5</span> Automatic number after explicit number</a></li><li><a href="#sec-number-nested" title="Multi-step explicit numbers"><span class="secnum">7.6</span> Multi-step explicit numbers</a><ol class="toc"><li><a href="#sec-number-multi-step" title="Multi-step explicit numbers"><span class="secnum">7.6.1.1</span> Multi-step explicit numbers</a></li><li><a href="#sec-number-multi-step-1" title="Automatic number after explicit number"><span class="secnum">7.6.1.2</span> Automatic number after explicit number</a></li><li><a href="#sec-number-multi-step-2" title="Increasing multi-step explicit numbers"><span class="secnum">7.6.2.1</span> Increasing multi-step explicit numbers</a></li></ol></li></ol></li><li><a href="#sec-annex" title="Annex"><span class="secnum">Annex A <span class="annex-kind">(informative)</span></span> Annex</a><ol class="toc"><li><a href="#sec-annex2" title="Sub-annex"><span class="secnum">A.1</span> Sub-annex</a></li></ol></li></ol></div><emu-intro id="sec-intro">
<h1>Intro</h1>
<emu-intro id="sec-intro2">
Expand Down Expand Up @@ -59,4 +59,4 @@ <h1><span class="secnum">A.1</span> Sub-annex</h1>

</emu-annex>
</emu-annex>
</div></body>
</div><div id="back-cover"><hr><hr><hr></div></body>