From 8d679ad58d6930eb9dfe2be5c03086af0a0dd992 Mon Sep 17 00:00:00 2001
From: Reorx <novoreorx@gmail.com>
Date: Tue, 6 Sep 2022 01:43:08 +0800
Subject: [PATCH] add shortcode tweet-ref for creating tweet reference in
 footnotes

---
 assets/css/common/post-single.css        | 30 +++++++++++++++++++++++-
 layouts/partials/social_quote_tweet.html |  2 +-
 layouts/shortcodes/tweet-ref.html        | 10 ++++++++
 3 files changed, 40 insertions(+), 2 deletions(-)
 create mode 100644 layouts/shortcodes/tweet-ref.html

diff --git a/assets/css/common/post-single.css b/assets/css/common/post-single.css
index 432e0d1..1efd99a 100644
--- a/assets/css/common/post-single.css
+++ b/assets/css/common/post-single.css
@@ -513,6 +513,7 @@ h6:hover .anchor {
 .social-links {
     margin: calc(var(--content-gap) * 2) 0;
 }
+/* shortcode */
 .social-quote {
     padding: 1em;
 }
@@ -608,6 +609,14 @@ h6:hover .anchor {
 .footnotes hr {
     display: none;
 }
+.footnotes a {
+    box-shadow: none;
+    text-decoration: underline;
+}
+.footnotes a:hover {
+    box-shadow: none;
+    text-decoration: underline;
+}
 .footnotes ol {
     margin: 0;
 }
@@ -618,7 +627,11 @@ h6:hover .anchor {
     line-height: 1.5em;
     margin: 0;
 }
-.footnotes ol li:target p {
+/* fix tweet-ref makes the li markers sink at the bottom */
+.footnotes ol li > * {
+    vertical-align: top;
+}
+.footnotes ol li:target {
     background-color: var(--link-background-color);
 }
 .footnotes ol:before {
@@ -627,3 +640,18 @@ h6:hover .anchor {
     margin-left: -1em;
     font-weight: 200;
 }
+
+/* shortcode */
+.tweet-ref {
+    width: calc(100% - 2em);
+    display: inline-block;
+}
+.tweet-ref blockquote {
+    margin: 3px 0 0 0;
+    border-inline-color: var(--tertiary);
+    line-height: 1.5em;
+}
+
+.tweet-ref blockquote a {
+    text-decoration: none;
+}
diff --git a/layouts/partials/social_quote_tweet.html b/layouts/partials/social_quote_tweet.html
index b3068aa..d0bd66d 100644
--- a/layouts/partials/social_quote_tweet.html
+++ b/layouts/partials/social_quote_tweet.html
@@ -4,7 +4,7 @@
     {{ with .title }}<span>{{ . }}</span>{{ end }}
   </div>
 
-  {{ $dnt := true }}
+  {{- $dnt := true -}}
   {{- $url := printf "https://twitter.com/%v/status/%v" .user .id -}}
   {{- $query := querify "url" $url "dnt" $dnt -}}
   {{- $request := printf "https://publish.twitter.com/oembed?%s" $query -}}
diff --git a/layouts/shortcodes/tweet-ref.html b/layouts/shortcodes/tweet-ref.html
new file mode 100644
index 0000000..cf02c4c
--- /dev/null
+++ b/layouts/shortcodes/tweet-ref.html
@@ -0,0 +1,10 @@
+<div class="tweet-ref">
+  {{- $url := .Get 0 -}}
+  From <a href="{{ $url }}">{{ strings.TrimPrefix "https://" $url }}</a>:
+
+  {{- $dnt := true -}}
+  {{- $query := querify "url" $url "dnt" $dnt -}}
+  {{- $request := printf "https://publish.twitter.com/oembed?%s" $query -}}
+  {{- $json := getJSON $request -}}
+  {{- replaceRE "<script.+/script>" "" $json.html | safeHTML -}}
+</div>