phil/hugo-tufte
1
0
Fork 0
forked from mirrors/hugo-tufte
Code Pull requests Activity

Sidenotes, fonts, sizing, dimensions.

Browse source
This commit is contained in:
Phil Bajsicki 2024-09-28 00:42:29 +02:00
parent 2c394893ee
commit 97e72f111a
4 changed files with 47 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
assets/scss/components/brand.scss
View file

@ -2,3 +2,7 @@
padding-top: 1rem; padding-top: 1rem;
padding-bottom: 1rem; padding-bottom: 1rem;
} }
.brand > h1 {
font-size: 2.5em;
}

2
assets/scss/components/nav.scss
View file

@ -8,7 +8,7 @@
padding: 0; padding: 0;
max-width: 45rem; max-width: 45rem;
/* Width is the same as tufte.css body */ /* Width is the same as tufte.css body */
font-size: 1.2rem; font-size: 2rem;
width: 87.5%; width: 87.5%;
} }

21
assets/scss/general.scss
View file

@ -43,8 +43,8 @@ hr {
margin-left: 0; margin-left: 0;
margin-top: 1.4rem; margin-top: 1.4rem;
margin-bottom: 1.4rem; margin-bottom: 1.4rem;
width: 75%; width: 100%;
max-width: 45rem; max-width: 90rem;
border-style: solid none none none; border-style: solid none none none;
border-color: #ddd; border-color: #ddd;
} }
@ -65,23 +65,34 @@ mark {
/* ------------------------------------------------------------------------ */ /* ------------------------------------------------------------------------ */
.list-page { .list-page {
ul { ul {
list-style-type: none;
margin: -0.25em; margin: -0.25em;
width: 87.5%; width: 100%;
max-width: 45rem; max-width: 45rem;
} }
li { li {
margin: 0; margin: 0;
/*font-size: 95%;*/ /*font-size: 95%;*/
} }
} }
.list-page .list-date { .list-page .list-date {
display: inline; display: inline;
font-size: 0.75em; font-size: 0.9em;
/* padding-right: 2em; */ /* padding-right: 2em; */
/* margin-right: 2em; */ /* margin-right: 2em; */
} }
.list-page > ul > ul > ul > li > a {
display: block;
margin-left: 3em;
}
.list-date a {
display: block;
font-size: 0.85em;
width: 100%;
}
table:not(.lntable) { table:not(.lntable) {
margin-top: 1.4em; margin-top: 1.4em;
font-size: 1.4rem; font-size: 1.4rem;

42
assets/scss/tufte.scss
View file

@ -60,17 +60,17 @@ $mono-fonts: Consolas, "Liberation Mono", Menlo, Courier, monospace, "Noto Emoji
/* Tufte CSS styles */ /* Tufte CSS styles */
html { html {
font-size: 15px; font-size: 0.65rem;
} }
body { body {
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
padding-left: 5%; padding-left: 5%;
font-family: $serif-fonts; font-family: $mono-fonts;
background-color: #151515; background-color: #151515;
color: #ddd; color: #ddd;
max-width: 1400px; max-width: #{"min(90vw, 1400px)"};
} }
h1, h2, h3 { h1, h2, h3 {
@ -81,7 +81,7 @@ h1, h2, h3 {
h1 { h1 {
margin-top: 1rem; margin-top: 1rem;
margin-bottom: 1rem; margin-bottom: 1rem;
font-size: 3.2rem; font-size: 2.4rem;
} }
h2, h3 { h2, h3 {
@ -95,7 +95,7 @@ h2 {
} }
h3 { h3 {
font-size: 1.7rem; font-size: 2rem;
margin-top: 2rem; margin-top: 2rem;
} }
@ -293,36 +293,46 @@ img {
// } // }
.sidenote { .sidenote {
box-sizing: border-box;
float: right; float: right;
position: absolute;
left: calc(100vw - 46vw);
right: 2.5vw;
width: auto; width: auto;
position: absolute;
left: 57.5%;
right: 2.5%;
border-style: solid; border-style: solid;
border-width: 2px; border-width: 2px;
border-color: #333333; border-color: #333333;
padding: 8px;
padding-bottom: 4px;
padding-top: 4px;
font-size: 1rem; font-size: 1rem;
line-height: 1.3; line-height: 1.3;
} }
.marginnote { .marginnote {
box-sizing: border-box;
float: right; float: right;
width: auto;
position: absolute;
left: 57.5%;
right: 2.5%;
border-style: solid; border-style: solid;
border-width: 2px; border-width: 2px;
border-color: #333333; border-color: #333333;
padding: 8px; padding: 8px;
padding-bottom: 0; padding-bottom: 0;
padding-top: 0; padding-top: 0;
left: 57.5%;
right: 2.5%;
margin-top: 10px; margin-top: 10px;
margin-bottom: 10px; margin-bottom: 10px;
width: auto;
position: absolute;
} }
.marginnote p { .marginnote p {
@ -397,7 +407,7 @@ div.table-wrapper {
font-family: "Trebuchet MS", "Gill Sans", "Gill Sans MT", sans-serif, "Noto Emoji"; font-family: "Trebuchet MS", "Gill Sans", "Gill Sans MT", sans-serif, "Noto Emoji";
} }
@media screen and (max-width: 760px) { @media screen and (max-width: 760px) {
h2, h2,
h3, h3,
p, p,