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

address https://github.com/loikein/hugo-tufte/issues/2

Browse source
This commit is contained in:
loikein 2023-04-14 23:34:42 +01:00
parent e6d583a987
commit a881ce922f
5 changed files with 29 additions and 60 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
assets/scss/general.scss
View file

@ -4,8 +4,6 @@
/* accomodate a blog-like site. */
/* ------------------------------------------------------------------------ */
@import url("https://fonts.googleapis.com/css2?family=Fira+Code:wght@351&display=swap");
/* When setting the primary font stack, apply it to the Pure grid units along */
/* with `html`, `button`, `input`, `select`, and `textarea`. Pure Grids use */
/* specific font stacks to ensure the greatest OS/browser compatibility. */
@ -21,7 +19,7 @@ article,
header,
footer,
.pure-g [class*="pure-u"] {
font-family: et-book, "Noto Serif SC", Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif;
font-family: et-book, "Noto Serif SC", Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif, "Noto Emoji";
}
p {
@ -29,7 +27,7 @@ p {
}
code {
font-family: "Fira Code", Consolas, "Liberation Mono", Menlo, Courier, monospace;
font-family: Menlo, Meslo, Courier, monospace;
font-size: 1.125rem;
line-height: 1.6;
}

61
assets/scss/vendor/tufte.scss vendored
View file

@ -64,11 +64,11 @@ body {
margin-left: auto;
margin-right: auto;
padding-left: 12.5%;
font-family: et-book, "Noto Serif SC", Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif;
font-family: et-book, "Noto Serif SC", Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif, "Noto Emoji";
background-color: #fffff8;
color: #111;
max-width: 1400px;
counter-reset: sidenote-counter;
counter-reset: sidenote;
}
h1 {
@ -227,41 +227,6 @@ a:visited {
color: inherit;
}
a:link {
text-decoration: none;
background: -webkit-linear-gradient(#fffff8, #fffff8), -webkit-linear-gradient(#fffff8, #fffff8),
-webkit-linear-gradient(#333, #333);
background: linear-gradient(#fffff8, #fffff8), linear-gradient(#fffff8, #fffff8), linear-gradient(#333, #333);
-webkit-background-size: 0.05em 1px, 0.05em 1px, 1px 1px;
-moz-background-size: 0.05em 1px, 0.05em 1px, 1px 1px;
background-size: 0.05em 1px, 0.05em 1px, 1px 1px;
background-repeat: no-repeat, no-repeat, repeat-x;
text-shadow: 0.03em 0 #fffff8, -0.03em 0 #fffff8, 0 0.03em #fffff8, 0 -0.03em #fffff8, 0.06em 0 #fffff8,
-0.06em 0 #fffff8, 0.09em 0 #fffff8, -0.09em 0 #fffff8, 0.12em 0 #fffff8, -0.12em 0 #fffff8, 0.15em 0 #fffff8,
-0.15em 0 #fffff8;
background-position: 0% 93%, 100% 93%, 0% 93%;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
a:link {
background-position-y: 87%, 87%, 87%;
}
}
a:link::selection {
text-shadow: 0.03em 0 #b4d5fe, -0.03em 0 #b4d5fe, 0 0.03em #b4d5fe, 0 -0.03em #b4d5fe, 0.06em 0 #b4d5fe,
-0.06em 0 #b4d5fe, 0.09em 0 #b4d5fe, -0.09em 0 #b4d5fe, 0.12em 0 #b4d5fe, -0.12em 0 #b4d5fe, 0.15em 0 #b4d5fe,
-0.15em 0 #b4d5fe;
background: #b4d5fe;
}
a:link::-moz-selection {
text-shadow: 0.03em 0 #b4d5fe, -0.03em 0 #b4d5fe, 0 0.03em #b4d5fe, 0 -0.03em #b4d5fe, 0.06em 0 #b4d5fe,
-0.06em 0 #b4d5fe, 0.09em 0 #b4d5fe, -0.09em 0 #b4d5fe, 0.12em 0 #b4d5fe, -0.12em 0 #b4d5fe, 0.15em 0 #b4d5fe,
-0.15em 0 #b4d5fe;
background: #b4d5fe;
}
/* Sidenotes, margin notes, figures, captions */
img {
max-width: 100%;
@ -292,28 +257,26 @@ img {
line-height: 1.6;
}
.marginnote-ind,
.sidenote-number {
counter-increment: sidenote-counter;
}
.sidenote-number:after,
.sidenote:before {
content: counter(sidenote-counter) " ";
font-family: et-book-roman-old-style;
// font-family: et-book-roman-old-style, "Noto Emoji";
position: relative;
vertical-align: baseline;
user-select: none;
}
.sidenote-number:after {
content: counter(sidenote-counter);
// note indicator
label.marginnote-ind,
label.sidenote-number {
font-size: 1rem;
top: -0.5rem;
left: 0.1rem;
}
.sidenote:before {
content: counter(sidenote-counter) " ";
top: -0.5rem;
// inside sidenote
span.marginnote-ind,
span.sidenote-number {
font-size: 1.1rem;
}
p,

4
layouts/partials/header.includes.html
View file

@ -11,9 +11,9 @@
<!-- https://csswizardry.com/2020/05/the-fastest-google-fonts/#google-fonts-async-snippet -->
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link rel="preload" as="style"
href="https://fonts.googleapis.com/css?family=Noto+Serif+SC&display=swap" />
href="https://fonts.googleapis.com/css?family=Noto+Serif+SC|Noto+Emoji&display=swap" />
<link rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Noto+Serif+SC&display=swap"
href="https://fonts.googleapis.com/css?family=Noto+Serif+SC|Noto+Emoji&display=swap"
media="print" onload="this.media='all'" />
<noscript>
<link rel="stylesheet"

4
layouts/shortcodes/marginnote.html
View file

@ -1,4 +1,4 @@
{{ $marginnoteDomIdSuffix := .Ordinal }}
<label for="marginnote-{{.Page.File.UniqueID}}-{{ $marginnoteDomIdSuffix }}" class="margin-toggle">&#8853;</label>
<label for="marginnote-{{.Page.File.UniqueID}}-{{ $marginnoteDomIdSuffix }}" class="margin-toggle marginnote-ind">&#128172;</label>
<input type="checkbox" id="marginnote-{{.Page.File.UniqueID}}-{{ $marginnoteDomIdSuffix }}" class="margin-toggle"/>
<span class="marginnote">{{ .Inner | markdownify}}</span>
<span class="marginnote"><span class="marginnote-ind">&#128172;</span> {{ .Inner | markdownify}}</span>

14
layouts/shortcodes/sidenote.html
View file

@ -1,3 +1,11 @@
{{ $sidenoteDomIdSuffix := .Ordinal }}<label for="sidenote-{{.Page.File.UniqueID}}-{{ $sidenoteDomIdSuffix }}" class="margin-toggle sidenote-number"></label>
<input type="checkbox" id="sidenote-{{.Page.File.UniqueID}}-{{ $sidenoteDomIdSuffix }}" class="margin-toggle"/>
<span class="sidenote">{{ .Inner | markdownify }}</span>
{{- with $.Page.Scratch.Get "sidenoteCounter" -}}
{{- $.Page.Scratch.Set "sidenoteCounter" (add . 1) -}}
{{- else -}}
{{- $.Page.Scratch.Set "sidenoteCounter" 1 -}}
{{- end -}}
{{ $sidenoteDomIdSuffix := $.Page.Scratch.Get "sidenoteCounter" }}
<label for="sidenote-{{ $sidenoteDomIdSuffix }}" class="margin-toggle sidenote-number">({{ $sidenoteDomIdSuffix }})</label>
<input type="checkbox" id="sidenote-{{ $sidenoteDomIdSuffix }}" class="margin-toggle"/>
<span class="sidenote">
<span class="sidenote-number">({{ $sidenoteDomIdSuffix }})</span> {{ .Inner | markdownify }}
</span>