From 8f09b518ba37c991a584c413e618430b3d397468 Mon Sep 17 00:00:00 2001
From: Danila Fedorin <danila.fedorin@gmail.com>
Date: Mon, 2 Mar 2020 21:30:23 -0800
Subject: [PATCH] Add sidenote delimiters to make the site not look bad with
 CSS off

---
 themes/vanilla/assets/scss/sidenotes.scss               | 4 ++++
 themes/vanilla/layouts/partials/head.html               | 1 +
 themes/vanilla/layouts/partials/sidenotes.html          | 5 +++++
 themes/vanilla/layouts/shortcodes/numberedsidenote.html | 2 ++
 themes/vanilla/layouts/shortcodes/sidenote.html         | 2 ++
 5 files changed, 14 insertions(+)
 create mode 100644 themes/vanilla/layouts/partials/sidenotes.html

diff --git a/themes/vanilla/assets/scss/sidenotes.scss b/themes/vanilla/assets/scss/sidenotes.scss
index b7dd3d2..2c20023 100644
--- a/themes/vanilla/assets/scss/sidenotes.scss
+++ b/themes/vanilla/assets/scss/sidenotes.scss
@@ -68,6 +68,10 @@ $sidenote-highlight-border-width: .2rem;
     text-align: left;
 }
 
+.sidenote-delimiter {
+    display: none;
+}
+
 @mixin hidden-sidenote {
     position: static;
     margin-top: 1rem;
diff --git a/themes/vanilla/layouts/partials/head.html b/themes/vanilla/layouts/partials/head.html
index 404144f..be5859a 100644
--- a/themes/vanilla/layouts/partials/head.html
+++ b/themes/vanilla/layouts/partials/head.html
@@ -8,6 +8,7 @@
     {{ $style := resources.Get "scss/style.scss" | resources.ToCSS | resources.Minify }}
     {{ $sidenotes := resources.Get "scss/sidenotes.scss" | resources.ToCSS | resources.Minify }}
     {{ $icon := resources.Get "img/favicon.png" }}
+    {{- partial "sidenotes.html" . -}}
     <link rel="stylesheet" href="{{ $style.Permalink }}">
     <link rel="stylesheet" href="{{ $sidenotes.Permalink }}">
     <link rel="icon" type="image/png" href="{{ $icon.Permalink }}">
diff --git a/themes/vanilla/layouts/partials/sidenotes.html b/themes/vanilla/layouts/partials/sidenotes.html
new file mode 100644
index 0000000..3cde4c2
--- /dev/null
+++ b/themes/vanilla/layouts/partials/sidenotes.html
@@ -0,0 +1,5 @@
+<style>
+.sidenote-checkbox {
+    display: none;
+}
+</style>
diff --git a/themes/vanilla/layouts/shortcodes/numberedsidenote.html b/themes/vanilla/layouts/shortcodes/numberedsidenote.html
index 0b6358a..d9fb351 100644
--- a/themes/vanilla/layouts/shortcodes/numberedsidenote.html
+++ b/themes/vanilla/layouts/shortcodes/numberedsidenote.html
@@ -4,6 +4,8 @@
 <label class="sidenote-label" for="numbernote-{{ $id }}">({{ $id }})</label>
 <input class="sidenote-checkbox" type="checkbox" id="numbernote-{{ $id }}"></input>
 <span class="sidenote-content sidenote-{{ .Get 0 }}">
+<span class="sidenote-delimiter">[note:</span>
 {{ .Inner }}
+<span class="sidenote-delimiter">]</span>
 </span>
 </span>
diff --git a/themes/vanilla/layouts/shortcodes/sidenote.html b/themes/vanilla/layouts/shortcodes/sidenote.html
index 455b908..61ae8e9 100644
--- a/themes/vanilla/layouts/shortcodes/sidenote.html
+++ b/themes/vanilla/layouts/shortcodes/sidenote.html
@@ -2,6 +2,8 @@
 <label class="sidenote-label" for="{{ .Get 1 }}">{{ .Get 2 }}</label>
 <input class="sidenote-checkbox" type="checkbox" id="{{ .Get 1 }}"></input>
 <span class="sidenote-content sidenote-{{ .Get 0 }}">
+<span class="sidenote-delimiter">[note:</span>
 {{ .Inner }}
+<span class="sidenote-delimiter">]</span>
 </span>
 </span>