starting layout-2

This commit is contained in:
Julie Blanc 2026-01-19 23:14:58 +01:00
parent abbd549428
commit e055fc96ee
9 changed files with 142 additions and 139 deletions

View file

@ -1,7 +1,7 @@
@page {
@footnote {
float: bottom;
footnote-policy: auto;
}
}
@ -11,11 +11,12 @@
.inline-note {
float: footnote;
footnote-policy: auto;
font-size: 9px;
line-height: calc(var(--baseline)*0.9);
line-height: calc(var(--baseline)*0.8);
padding-left: var(--indent);
position: relative;
font-weight: 100;
// font-weight: 100;
&::marker{
display: none;

View file

@ -2,18 +2,20 @@
@page {
size: 134mm 205mm;
// size: 150mm 220mm;
margin-top: 67px;
margin-bottom: 10mm;
margin-left: 10mm;
margin-right: 10mm;
bleed: 6mm;
marks: crop;
margin-top: 36px;
margin-bottom: 20mm;
// bleed: 6mm;
// marks: crop;
}
@page:left {
margin-left: 12mm;
margin-right: 32mm;
@top-left {
margin-left: 22mm;
margin-right: 22mm;
@bottom-left {
content: counter(page);
font-family: var(--font-title);
font-weight: 500;
font-size: var(--fs-num);
}
// @top-right {
// content: "Höchstpersönlichkeit";
@ -23,14 +25,17 @@
}
@page:right {
margin-left: 32mm;
margin-right: 12mm;
@top-right {
margin-right: 22mm;
@bottom-right {
content: counter(page);
font-family: var(--font-title);
font-weight: 500;
font-size: var(--fs-num);
}
@top-left {
@bottom-left {
content: "Höchstpersönlichkeit";
font-variant-caps: small-caps;
letter-spacing: 0.05em;
font-family: var(--font-title);
font-weight: normal;
}
}

View file

@ -69,22 +69,23 @@ ol[type="1"] + p{
blockquote{
padding-left: var(--indent);
margin-top: calc(var(--baseline)*1);
margin-bottom: calc(var(--baseline)*1);
padding-left: calc(var(--indent)*2);
// color: red;
// margin-top: calc(var(--baseline)*1);
// margin-bottom: calc(var(--baseline)*1);
p{
font-style: italic;
em{
font-style: normal;
}
// font-family: "Edgar";
// em{
// font-style: normal;
// }
}
u{
font-variant: small-caps;
text-decoration: none;
}
// u{
// font-variant: small-caps;
// text-decoration: none;
// }
}

View file

@ -28,19 +28,19 @@
h1{
font-family: var(--font-title);
font-weight: normal;
font-size: 1.5rem;
font-size: 1.6rem;
font-weight: 500;
text-transform: uppercase;
line-height: calc(var(--baseline)*1.4);
text-align: center;
position: relative;
margin-top: calc(var(--baseline)*3 - 3px);
margin-top: calc(var(--baseline)*2 - 3px);
padding-bottom: calc(var(--baseline)*1);
padding-left: 1ch;
padding-right: 1ch;
&::before{
display: block;
font-size: 1rem;
font-size: var(--fs-num);
}
}
@ -53,68 +53,67 @@
h2{
font-family: var(--font-title);
font-weight: normal;
font-size: 1.3rem;
font-size: 1.1rem;
font-weight: 500;
text-transform: uppercase;
line-height: calc(var(--baseline)*1.2);
text-align: right;
padding-left: 3ch;
text-align: center;
position: relative;
margin-top: calc(var(--baseline)*1 + 9px);
margin-top: calc(var(--baseline)*1 + 6px);
padding-bottom: calc(var(--baseline)*1);
padding-left: 2ch;
padding-right: 2ch;
&::before{
position: absolute;
left: 0;
display: block;
font-size: var(--fs-num);
}
}
h3{
font-family: var(--font-sans);
font-weight: normal;
font-family: var(--font-title);
font-weight: 500;
font-size: 1rem;
line-height: calc(var(--baseline)*1);
text-align: right;
padding-left: 3ch;
padding-left: var(--indent);
padding-right: calc(var(--indent)*2);
position: relative;
margin-top: calc(var(--baseline)*1 + 9px);
padding-bottom: calc(var(--baseline)*1);
margin-top: calc(var(--baseline)*1 + 4px);
padding-bottom: calc(var(--baseline)*0.75);
&::before{
// font-family: 'Helixotrope 4';
// font-size: var(--font-size);
// font-weight: bold;
position: absolute;
left: 0;
}
}
h4{
font-family: var(--font-sans);
font-weight: normal;
font-family: var(--font-title);
font-weight: 500;
font-size: 0.9rem;
line-height: calc(var(--baseline)*1);
padding-left: calc(var(--indent)*1);
padding-right: calc(var(--indent)*2);
position: relative;
margin-top: calc(var(--baseline)*1 + 4px);
padding-bottom: calc(var(--baseline)*0.75);
}
h5{
font-family: var(--font-title);
font-weight: 500;
font-size: 0.8rem;
line-height: calc(var(--baseline)*1);
text-align: right;
padding-left: 3ch;
padding-left: calc(var(--indent)*1);
// padding-right: calc(var(--indent)*2);
position: relative;
margin-top: calc(var(--baseline)*0.5);
margin-bottom: calc(var(--baseline)*0.5);
font-weight: 500;
margin-top: calc(var(--baseline)*1 + 4px);
padding-bottom: calc(var(--baseline)*0.25);
}
h5{
font-family: var(--font-sans);
font-weight: normal;
font-size: 0.7rem;
line-height: calc(var(--baseline)*1);
position: relative;
margin-top: calc(var(--baseline)*0.75);
margin-bottom: calc(var(--baseline)*0.25);
}
}

View file

@ -1,8 +1,9 @@
:root{
--font: 'Edgar', sans-serif;
--font-title: "Heliotrope 3 Caps", sans-serif;
--font-sans: "Heliotrope 4", sans-serif;
--font-size: 12px;
--font-title: 'Allium Rounded', sans-serif;
--font-sans: 'Allium Rounded', sans-serif;
--font-size: 11px;
--fs-num: 14px;
--baseline: 16px;
--indent: 26px;