add Baskemo
This commit is contained in:
Julie Blanc
parent
a8ab44f5a6
commit
ffa89ed031
18 changed files with 337 additions and 165 deletions
|
|
@ -2,18 +2,16 @@
|
|||
@import url("https://fonts.googleapis.com/css2?family=Literata:ital,opsz,wght@0,7..72,200..900;1,7..72,200..900&display=swap");
|
||||
@import url("https://fonts.googleapis.com/css2?family=Vollkorn:ital,wght@0,400..900;1,400..900&display=swap");
|
||||
:root {
|
||||
--font: "Routed Gothic", sans-serif;
|
||||
--mono: "Selectric Mono", monospace;
|
||||
--mono: "Ivory Mono", monospace;
|
||||
--note: "Routed Gothic", serif;
|
||||
--title: "HNoailles Times Triplex", sans-serif;
|
||||
--font: 'Routed Gothic', sans-serif;
|
||||
--mono: 'Selectric Mono', monospace;
|
||||
--mono: 'Ivory Mono', monospace;
|
||||
--mono: 'Baskemo Sans', monospace;
|
||||
--note: 'Routed Gothic', serif;
|
||||
--title: 'HNoailles Times Triplex', sans-serif;
|
||||
--red: #9B0000;
|
||||
--green:#009B00;
|
||||
--green-light:#009b0025;
|
||||
--blue: #00009B;
|
||||
--red: black;
|
||||
--green:black;
|
||||
--blue: black;
|
||||
--indent: 7mm;
|
||||
--font-size: 14px;
|
||||
--baseline: 18px;
|
||||
|
|
@ -49,26 +47,27 @@ body {
|
|||
@page :left {
|
||||
margin-left: 18mm;
|
||||
margin-right: 26mm;
|
||||
@bottom-left-corner {
|
||||
@bottom-left {
|
||||
content: counter(page);
|
||||
font-family: var(--mono);
|
||||
font-size: 10px;
|
||||
font-family: var(--font);
|
||||
font-size: 20px;
|
||||
vertical-align: bottom;
|
||||
padding-bottom: 5mm;
|
||||
width: 10mm;
|
||||
}
|
||||
@bottom-center {
|
||||
content: string(author);
|
||||
font-family: var(--font);
|
||||
font-size: 12px;
|
||||
vertical-align: bottom;
|
||||
padding-bottom: 5mm;
|
||||
text-align: left;
|
||||
padding-left: 10mm;
|
||||
padding-left: 3ch;
|
||||
}
|
||||
@bottom-left {
|
||||
content: string(author);
|
||||
font-family: var(--mono);
|
||||
font-size: 10px;
|
||||
vertical-align: bottom;
|
||||
padding-bottom: 5mm;
|
||||
}
|
||||
@bottom-center {
|
||||
@bottom-right {
|
||||
content: string(type);
|
||||
font-family: var(--mono);
|
||||
font-size: 10px;
|
||||
font-family: var(--font);
|
||||
font-size: 12px;
|
||||
vertical-align: bottom;
|
||||
padding-bottom: 5mm;
|
||||
}
|
||||
|
|
@ -76,19 +75,19 @@ body {
|
|||
@page :right {
|
||||
margin-left: 26mm;
|
||||
margin-right: 18mm;
|
||||
@bottom-right-corner {
|
||||
@bottom-right {
|
||||
content: counter(page);
|
||||
font-family: var(--mono);
|
||||
font-size: 10px;
|
||||
font-family: var(--font);
|
||||
font-size: 20px;
|
||||
vertical-align: bottom;
|
||||
padding-bottom: 5mm;
|
||||
width: 10mm;
|
||||
text-align: right;
|
||||
padding-right: 10mm;
|
||||
}
|
||||
@bottom-left {
|
||||
content: string(title);
|
||||
font-family: var(--mono);
|
||||
font-size: 10px;
|
||||
font-family: var(--font);
|
||||
font-size: 12px;
|
||||
vertical-align: bottom;
|
||||
padding-bottom: 5mm;
|
||||
}
|
||||
|
|
@ -110,7 +109,7 @@ body {
|
|||
}
|
||||
|
||||
[data-type=vollkorn] {
|
||||
font-family: "Literata", serif;
|
||||
font-family: "Vollkorn", serif;
|
||||
}
|
||||
|
||||
[data-type=timezone] {
|
||||
|
|
@ -226,6 +225,10 @@ body {
|
|||
font-weight: 200;
|
||||
}
|
||||
|
||||
[data-type=baskemo-sans] {
|
||||
font-family: "Baskemo Sans", serif;
|
||||
}
|
||||
|
||||
#type-specimen {
|
||||
background-color: #cfcfcf;
|
||||
}
|
||||
|
|
@ -248,8 +251,7 @@ body {
|
|||
}
|
||||
#type-specimen p:first-of-type {
|
||||
text-align: justify;
|
||||
-webkit-hyphens: auto;
|
||||
hyphens: auto;
|
||||
hyphens: auto;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
#type-specimen p {
|
||||
|
|
@ -324,11 +326,9 @@ body {
|
|||
|
||||
.chapter p {
|
||||
text-align: justify;
|
||||
-webkit-hyphens: auto;
|
||||
hyphens: auto;
|
||||
hyphens: auto;
|
||||
hyphenate-limit-chars: 8 3;
|
||||
position: relative;
|
||||
color: var(--blue);
|
||||
font-weight: 200;
|
||||
letter-spacing: 0.01rem;
|
||||
}
|
||||
|
|
@ -345,6 +345,7 @@ body {
|
|||
color: var(--blue);
|
||||
max-width: 18ch;
|
||||
letter-spacing: 0.05rem;
|
||||
color: black;
|
||||
}
|
||||
.chapter blockquote {
|
||||
padding-left: var(--indent);
|
||||
|
|
@ -359,10 +360,16 @@ body {
|
|||
position: relative;
|
||||
}
|
||||
|
||||
.inline-note {
|
||||
font-size: 10px;
|
||||
.pagedjs_footnote {
|
||||
font-family: var(--note);
|
||||
line-height: 1.2;
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
text-indent: -14mm;
|
||||
padding-left: 14mm;
|
||||
color: var(--green);
|
||||
}
|
||||
|
||||
.note-container {
|
||||
grid-column: center;
|
||||
grid-row: footer;
|
||||
|
|
@ -375,8 +382,35 @@ body {
|
|||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.pagedjs_footnotes::marker {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.pagedjs_footnote[data-footnote-call] {
|
||||
border: 1px solid currentColor;
|
||||
min-width: 14px;
|
||||
height: 14px;
|
||||
display: inline-flex;
|
||||
border-radius: 4px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
line-height: 0;
|
||||
white-space: 0px;
|
||||
font-variant-position: super;
|
||||
font-size: 10px;
|
||||
text-indent: 0px;
|
||||
position: relative;
|
||||
top: -2px;
|
||||
margin-left: 2px;
|
||||
}
|
||||
.pagedjs_footnote[data-footnote-call]::after {
|
||||
font-variant-position: normal;
|
||||
}
|
||||
|
||||
.chapter-header {
|
||||
margin-bottom: calc(var(--baseline) * 6);
|
||||
margin-top: calc(var(--baseline) * 2);
|
||||
margin-bottom: calc(var(--baseline) * 9);
|
||||
--color: black;
|
||||
}
|
||||
|
||||
.chapter-header h2 {
|
||||
|
|
@ -392,14 +426,15 @@ body {
|
|||
}
|
||||
|
||||
.chapter-header h2 {
|
||||
font-size: 42px;
|
||||
font-size: 40px;
|
||||
line-height: 0.9;
|
||||
font-family: var(--title);
|
||||
font-family: var(--mono);
|
||||
color: var(--blue);
|
||||
margin-bottom: calc(var(--baseline) * 1);
|
||||
text-align: left;
|
||||
font-weight: bold;
|
||||
font-weight: normal;
|
||||
padding-right: 3ch;
|
||||
color: var(--color);
|
||||
}
|
||||
|
||||
.chapter-header .type {
|
||||
|
|
@ -408,32 +443,36 @@ body {
|
|||
}
|
||||
|
||||
.chapter-header .bio {
|
||||
margin-top: calc(var(--baseline) * 1);
|
||||
font-family: var(--title);
|
||||
-webkit-hyphens: none;
|
||||
hyphens: none;
|
||||
margin-top: calc(var(--baseline) * 3);
|
||||
font-family: var(--mono);
|
||||
hyphens: none;
|
||||
font-size: 12px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.chapter-header .bio .name {
|
||||
text-indent: 0;
|
||||
text-align: left;
|
||||
font-weight: bold;
|
||||
font-weight: normal;
|
||||
color: var(--color);
|
||||
}
|
||||
.chapter-header .bio .description {
|
||||
text-indent: -14mm;
|
||||
padding-left: 14mm;
|
||||
text-align: left;
|
||||
font-weight: bold;
|
||||
font-weight: normal;
|
||||
color: var(--color);
|
||||
}
|
||||
|
||||
.chapter-header .author {
|
||||
left: 0px !important;
|
||||
font-size: 26px;
|
||||
font-size: 24px;
|
||||
font-weight: normal;
|
||||
line-height: 1;
|
||||
font-family: var(--font);
|
||||
text-align: center;
|
||||
text-align: right;
|
||||
text-align: left;
|
||||
text-indent: 0;
|
||||
text-indent: 14mm;
|
||||
color: var(--color);
|
||||
}
|
||||
|
||||
.item-decor {
|
||||
|
|
@ -441,7 +480,6 @@ body {
|
|||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
color: var(--green);
|
||||
}
|
||||
|
||||
.pagedjs_left_page .item-decor {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue