Julie/decor-6-expe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

change font-family for sign → teletext

Browse source
This commit is contained in:
Julie Blanc 2026-03-16 21:43:39 +01:00
parent 9344129a9f
commit ce4d7285fe
7 changed files with 75 additions and 60 deletions
Download patch file Download diff file Expand all files Collapse all files

1
maquette-tests/assets/css/01_var.css
View file

@ -66,6 +66,7 @@
--gap: 8px;
--sign-family: 'Teletext';
--sign-size: 16px;
--sign-baseline: 18px;
--sign-spacing: 0.45rem;

113
maquette-tests/assets/css/03_layout.css
View file

@ -8,7 +8,7 @@
marks: crop;
--symbol-top: 1px;
--running-top: 8mm;
--running-bottom: 10mm;
--running-bottom: 10mm;
}
@page:left {
@ -18,9 +18,10 @@
@top-left-corner {
content: var(--symbol) var(--symbol) var(--symbol);
font-size: var(--sign-size);
color: var(--sign-color);
letter-spacing: var(--sign-spacing);
line-height: var(--sign-baseline);
color: var(--sign-color);
letter-spacing: var(--sign-spacing);
font-family: var(--sign-family);
line-height: var(--sign-baseline);
vertical-align: top;
padding-top: var(--running-top);
text-align: left;
@ -36,11 +37,12 @@
width: calc(var(--unit)*2);
font-size: var(--font-size);
color: var(--sign-color);
font-family: var(--sign-family);
}
@top-center{
@top-center {
content: element(author);
vertical-align: top;
padding-top: calc(var(--running-top) - var(--symbol-top));
@ -48,53 +50,56 @@
white-space: nowrap;
padding-right: 1.5ch;
padding-left: 0.5ch;
font-size: var(--font-size);
color: var(--sign-color);
font-size: var(--font-size);
color: var(--sign-color);
font-family: var(--sign-family);
}
@top-right {
content: var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) ;
content: var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol);
font-size: var(--sign-size);
color: var(--sign-color);
letter-spacing: var(--sign-spacing);
font-family: var(--sign-family);
line-height: var(--sign-baseline);
vertical-align: top;
padding-top: var(--running-top);
width: 100%;
white-space: nowrap;
}
@bottom-left {
content: counter(page);
content: counter(page);
vertical-align: top;
padding-top: var(--running-bottom);
white-space: nowrap;
font-size: var(--font-size);
color: var(--sign-color);
z-index: 100;
white-space: nowrap;
font-size: var(--font-size);
color: var(--sign-color);
z-index: 100;
}
}
@page:right {
margin-left: 26mm;
margin-left: 26mm;
margin-right: 18mm;
@top-left-corner {
content: var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol);
font-size: var(--sign-size);
color: var(--sign-color);
letter-spacing: var(--sign-spacing);
line-height: var(--sign-baseline);
color: var(--sign-color);
letter-spacing: var(--sign-spacing);
font-family: var(--sign-family);
line-height: var(--sign-baseline);
vertical-align: top;
padding-top: var(--running-top);
text-align: left;
@ -103,20 +108,22 @@
}
@top-left {
content: element(title);
content: element(title);
vertical-align: top;
padding-top: var(--running-top);
white-space: nowrap;
white-space: nowrap;
padding-right: 1.5ch;
font-size: var(--font-size);
color: var(--sign-color);
font-family: var(--sign-family);
font-size: var(--font-size);
color: var(--sign-color);
}
@top-right {
content: var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) ;
content: var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol);
font-size: var(--sign-size);
color: var(--sign-color);
letter-spacing: var(--sign-spacing);
font-family: var(--sign-family);
line-height: var(--sign-baseline);
vertical-align: top;
padding-top: var(--running-top);
@ -125,15 +132,15 @@
}
@bottom-right {
content: counter(page);
@bottom-right {
content: counter(page);
vertical-align: top;
padding-top: var(--running-bottom);
text-align: right;
white-space: nowrap;
font-size: var(--font-size);
color: var(--sign-color);
z-index: 100;
white-space: nowrap;
font-size: var(--font-size);
color: var(--sign-color);
z-index: 100;
}
@ -149,13 +156,16 @@
@top-left {
content: none;
}
@top-left-corner {
content: none;
}
@top-right {
@top-right {
content: none;
}
@top-center {
@top-center {
content: none;
}
@ -185,27 +195,28 @@
position: running(decor);
}
.pagedjs_area{
position: relative;
.pagedjs_area {
position: relative;
}
.pagedjs_margin-top-left .pagedjs_margin-content .nav-decor::after{
content: var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol) ;
font-size: var(--sign-size);
color: var(--sign-color);
letter-spacing: var(--sign-spacing);
line-height: var(--sign-baseline);
padding-left: 1ch;
width: calc(var(--unit) + var(--sub-unit));
position: relative;
top: var(--symbol-top);
.pagedjs_margin-top-left .pagedjs_margin-content .nav-decor::after {
content: var(--symbol) var(--symbol) var(--symbol) var(--symbol) var(--symbol);
font-size: var(--sign-size);
color: var(--sign-color);
letter-spacing: var(--sign-spacing);
font-family: var(--sign-family);
line-height: var(--sign-baseline);
padding-left: 1ch;
width: calc(var(--unit) + var(--sub-unit));
position: relative;
top: var(--symbol-top);
}
.pagedjs_left_page .pagedjs_margin-top{
width: calc(100% + var(--pagedjs-margin-right));
overflow: hidden;
}
.pagedjs_left_page .pagedjs_margin-top {
width: calc(100% + var(--pagedjs-margin-right));
overflow: hidden;
}
/* DELETE BEFORE PRINT */
@ -223,7 +234,7 @@
.pagedjs_left_page .pagedjs_margin-bottom-left .pagedjs_margin-content::after{
.pagedjs_left_page .pagedjs_margin-bottom-left .pagedjs_margin-content::after {
background-color: white;
display: inline-block;
padding-left: 10px;
@ -234,7 +245,7 @@
.pagedjs_right_page .pagedjs_margin-bottom-right .pagedjs_margin-content::after{
.pagedjs_right_page .pagedjs_margin-bottom-right .pagedjs_margin-content::after {
background-color: white;
display: inline-block;
padding-right: 10px;

1
maquette-tests/assets/css/blockquote.css
View file

@ -35,6 +35,7 @@ blockquote p::before{
font-size: var(--sign-size);
color: var(--sign-color);
letter-spacing: var(--sign-spacing);
font-family: var(--sign-family);
line-height: var(--sign-baseline);
word-break: break-all;
width: calc(var(--unit)*0.5 + 4px);

1
maquette-tests/assets/css/running-page.css
View file

@ -3,6 +3,7 @@
font-size: var(--sign-size);
color: var(--sign-color);
letter-spacing: var(--sign-spacing);
font-family: var(--sign-family);
line-height: var(--sign-baseline);
vertical-align: top;
padding-top: var(--running-bottom);

5
maquette-tests/assets/css/subtitles.css
View file

@ -2,6 +2,7 @@ h3, h4{
break-after: avoid;
}
h3, h4{
font-family: var(--sign-family);
font-weight: normal;
margin-top: calc(var(--baseline)*1.5);
margin-bottom: calc(var(--baseline)*1);
@ -29,9 +30,6 @@ h3, h4{
justify-content: flex-end;
}
.subtitle-before{
padding-right: 0.75ch;
}
.subtitle-after{
padding-left: 0.75ch;
@ -49,6 +47,7 @@ h3, h4{
font-size: var(--sign-size);
color: var(--sign-color);
letter-spacing: var(--sign-spacing);
font-family: var(--sign-family);
line-height: var(--sign-baseline);
position: absolute;
}

2
maquette-tests/assets/css/text.css
View file

@ -18,6 +18,7 @@ p::before {
font-size: var(--sign-size);
color: var(--sign-color);
letter-spacing: var(--sign-spacing);
font-family: var(--sign-family);
line-height: var(--sign-baseline);
position: relative;
top: -3px;
@ -62,5 +63,6 @@ p::before {
font-size: var(--sign-size);
color: var(--sign-color);
letter-spacing: var(--sign-spacing);
font-family: var(--sign-family);
line-height: var(--sign-baseline);
}

12
maquette-tests/assets/fonts/Teletext/stylesheet.css
View file

@ -2,20 +2,20 @@
@font-face {
font-family: 'Teletext';
src: url('MODE7GX0.TTF') format('truetype');
font-weight: 100;
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
/* @font-face {
font-family: 'Teletext';
src: url('MODE7GX1.TTF') format('truetype');
font-weight: 200;
font-weight: normal;
font-style: normal;
font-display: swap;
}
} */
@font-face {
/* @font-face {
font-family: 'Teletext';
src: url('MODE7GX2.TTF') format('truetype');
font-weight: 300;
@ -37,4 +37,4 @@
font-weight: 500;
font-style: normal;
font-display: swap;
}
} */