Julie/walter-boente_book-collection
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

thesis align bottom

Browse source
This commit is contained in:
Julie Blanc 2026-04-21 23:28:03 +02:00
parent 725306418d
commit ed5d47184d
6 changed files with 62 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

4
css/modules/_layout.scss
View file

@ -25,8 +25,8 @@ $unit: calc($content-w/7);
size: $width $height; size: $width $height;
margin-top: $top; margin-top: $top;
margin-bottom: $bottom; margin-bottom: $bottom;
bleed: 6mm; // bleed: 6mm;
marks: crop; // marks: crop;
} }
@page:left { @page:left {
margin-left: $outside; margin-left: $outside;

2
css/modules/_notes.scss
View file

@ -43,7 +43,7 @@
font-family: var(--font-sans); font-family: var(--font-sans);
font-size: var(--fs-small); font-size: var(--fs-small);
font-weight: bold; font-weight: normal;
line-height: 1; line-height: 1;
position: relative; position: relative;
top: -4px; top: -4px;

44
css/modules/_text.scss
View file

@ -79,44 +79,40 @@ ul{
// THESE -------------------------------------------------- // THESE --------------------------------------------------
.thesis{
break-inside: avoid;
}
.thesis-title{ .thesis-title{
width: 100%; width: 100%;
display: flex; display: flex;
gap: 1ch;
} }
.thesis-title p::after{
content: ''; .thesis-line{
display: block;
width: 100%; width: 100%;
height: 10px; height: 8px;
background-color: black; background-color: black;
flex-grow: 1; position: relative;
top: 3px;
}
.thesis-title p{
flex-shrink: 0;
text-transform: uppercase;
font-weight: 500;
font-size: 0.9em;
letter-spacing: 0.01rem;
} }
.thesis p{ .thesis p{
display: block; display: block;
} }
// .p-these{
// font-weight: 500;
// margin-bottom: calc(var(--baseline)*0.5);
// display: block;
// strong{
// text-transform: uppercase;
// display: inline-block;
// min-width: $indent*2;
// font-weight: bold;
// font-size: var(--fs-small);
// letter-spacing: 0.05rem;
// }
// } .thesis + .thesis{
margin-top: calc(var(--baseline)*1);
// .p-these-last{ }
// margin-bottom: calc(var(--baseline)*1);
// }
// INTRO -------------------------------------------------- // INTRO --------------------------------------------------

31
css/style.css
View file

@ -43,8 +43,6 @@ body {
size: 176mm 240mm; size: 176mm 240mm;
margin-top: 10mm; margin-top: 10mm;
margin-bottom: 19mm; margin-bottom: 19mm;
bleed: 6mm;
marks: crop;
} }
@page :left { @page :left {
margin-left: 14mm; margin-left: 14mm;
@ -272,24 +270,41 @@ ul {
color: red; color: red;
} }
.thesis {
-moz-column-break-inside: avoid;
break-inside: avoid;
}
.thesis-title { .thesis-title {
width: 100%; width: 100%;
display: flex; display: flex;
gap: 1ch;
} }
.thesis-title p::after { .thesis-line {
content: "";
display: block;
width: 100%; width: 100%;
height: 10px; height: 8px;
background-color: black; background-color: black;
flex-grow: 1; position: relative;
top: 3px;
}
.thesis-title p {
flex-shrink: 0;
text-transform: uppercase;
font-weight: 500;
font-size: 0.9em;
letter-spacing: 0.01rem;
} }
.thesis p { .thesis p {
display: block; display: block;
} }
.thesis + .thesis {
margin-top: calc(var(--baseline) * 1);
}
.has-intro-1-paragraph .intro, .has-intro-1-paragraph .intro,
.has-intro .intro { .has-intro .intro {
-moz-column-break-after: right; -moz-column-break-after: right;
@ -516,7 +531,7 @@ ol[type="1"] {
.note_call { .note_call {
font-family: var(--font-sans); font-family: var(--font-sans);
font-size: var(--fs-small); font-size: var(--fs-small);
font-weight: bold; font-weight: normal;
line-height: 1; line-height: 1;
position: relative; position: relative;
top: -4px; top: -4px;

2
css/style.css.map
View file

File diff suppressed because one or more lines are too long

15
js/beforeAll.js
View file

@ -24,6 +24,17 @@ export default class beforeAll extends Handler {
intro.style.paddingTop = gap + "px"; intro.style.paddingTop = gap + "px";
} }
let thesisList = pageElement.querySelectorAll('.thesis');
if(thesisList.length > 0 && pageContent){
let lastThesis = thesisList[thesisList.length - 1];
let firstThesis = thesisList[0];
let lastThesisBottom = lastThesis.getBoundingClientRect().bottom;
let pageContentBottom = pageContent.getBoundingClientRect().bottom;
let gap = pageContentBottom - lastThesisBottom;
gap = gap - 4; // snap on baseline
firstThesis.style.marginTop = gap + "px";
}
} }
@ -194,7 +205,11 @@ function thesis(content){
thesisTitleDiv.classList.add('thesis-title'); thesisTitleDiv.classList.add('thesis-title');
const thesisP = document.createElement('p'); const thesisP = document.createElement('p');
thesisP.textContent = strong.textContent; thesisP.textContent = strong.textContent;
var line = document.createElement('div');
line.classList.add('thesis-line');
thesisTitleDiv.appendChild(thesisP); thesisTitleDiv.appendChild(thesisP);
thesisTitleDiv.appendChild(line)
thesisWrapper.appendChild(thesisTitleDiv); thesisWrapper.appendChild(thesisTitleDiv);
// Transform parent p into thesis-content // Transform parent p into thesis-content