M posts/essay/2018-03-05-installing-tinytinyrss-and-wallabag-on-nearlyfreespeech-net.md => posts/essay/2018-03-05-installing-tinytinyrss-and-wallabag-on-nearlyfreespeech-net.md +1 -0
@@ 1,6 1,7 @@
---
title: Installing tinytinyrss and wallabag on nearlyfreespeech.net
tags: [metablog, self hosting, typo]
+toc: yes
---
I've recently installed [tinytinyrss] and [wallabag] on this server (I'm not
M posts/essay/2019-02-28-reactions.md => posts/essay/2019-02-28-reactions.md +1 -0
@@ 2,6 2,7 @@
title: media, millenials, kindness, and cars
tags: media, millenials, kindness, cars
series: Reactions
+toc: yes
---
::: note
M posts/essay/2019-03-01-reactions.md => posts/essay/2019-03-01-reactions.md +1 -0
@@ 2,6 2,7 @@
title: socks, umami, turtles, and tech
tags: socks, umami, turtles, tech
series: Reactions
+toc: yes
---
# /u/whattodobedroom, ["I (28) think my girlfriend (26) has been using my gym socks to wipe after going to the bathroom."][socks]
M posts/essay/2019-03-02-reactions.md => posts/essay/2019-03-02-reactions.md +1 -0
@@ 2,6 2,7 @@
title: climate change, depression, fluff, and Mardi Gras
title: climate change, depression, fluff, Mardi Gras
series: Reactions
+toc: yes
---
::: note
M posts/essay/2019-03-04-reactions.md => posts/essay/2019-03-04-reactions.md +1 -0
@@ 2,6 2,7 @@
title: computers, Mardi Gras, communication, and living with our parents
tags: computers, Mardi Gras, communication, living with our parents
series: Reactions
+toc: yes
---
# Heather, Havrilesky, ["Is my absence from social media a red flag?"][flag]
M posts/essay/2019-03-12-reactions.md => posts/essay/2019-03-12-reactions.md +1 -0
@@ 2,6 2,7 @@
title: hometowns, shame, coffee, and whiteness
tags: hometowns, shame, coffee, whiteness
series: Reactions
+toc: yes
---
::: note
M posts/essay/2019-03-28-reactions.md => posts/essay/2019-03-28-reactions.md +1 -0
@@ 3,6 3,7 @@ title: pedestrians, coastlines, and navigation
# vim: ft=pandoc.markdown
series: Reactions
tags: pedestrians, coastlines, navigation
+toc: yes
---
# "[Why pedestrian deaths are at a 30-year high][ped]", Sea Stachura
M static/css/style.scss => static/css/style.scss +56 -0
@@ 575,6 575,62 @@ blockquote::before { content: "\201C"; }
right: 1rem;
}
+#toc {
+ float: right;
+ position: relative;
+ width: 12rem;
+ max-width: 40%;
+ margin-left: 1rem;
+ margin-top: -1rem;
+ margin-right: -1rem;
+ margin-bottom: 1rem;
+ padding-top: 1rem;
+ z-index: 100;
+ background: $color-bg-content;
+ border-left: 1px solid;
+ border-bottom: 1px solid;
+ padding-bottom: 1rem;
+}
+
+#toc[open] {
+ padding-bottom: 0;
+}
+
+#toc ul {
+ margin-bottom: 0;
+}
+#toc ul ul {
+ margin-top: 0;
+ margin-left: 1rem;
+}
+
+#toc li {
+ list-style: none;
+ margin: 0 0 0 -1rem;
+}
+
+#toc a:link {
+ display: block;
+ border-bottom: none;
+ box-shadow: none;
+ padding: 0.5rem 1rem;
+}
+#toc ul ul a:link {
+ border-left: 1px dotted;
+ font-style: italic;
+}
+
+#toc summary {
+ background: $color-bg-header;
+ text-transform: uppercase;
+ letter-spacing: 0.1em;
+ margin: -1rem 0;
+ padding: 1rem;
+ cursor: pointer;
+ display: block;
+}
+#toc ::-webkit-details-marker { display: none; }
+
/* }}} */
/* group-specific classes {{{ */
M templates/article.html => templates/article.html +7 -0
@@ 7,6 7,13 @@
$endif$
</header>
<section class="acontent">
+ $if(toc)$
+ <details id="toc" open>
+ <summary>Contents</summary>
+ $toc$
+ </details>
+ $endif$
+
$if(cover)$
$if(cover-link)$<a href="$cover-link$">$endif$
<img src="$cover$"