aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorEuAndreh <eu@euandre.org>2020-08-15 16:18:35 -0300
committerEuAndreh <eu@euandre.org>2020-08-15 16:19:12 -0300
commit9eb58da4307e39556ec600f581dbf49ef3a6c188 (patch)
treef23247822bd31ac49851432c31ea5b02ed906554
parentabout: Add link to boneco.euandreh.xyz (diff)
downloadeuandre.org-9eb58da4307e39556ec600f581dbf49ef3a6c188.tar.gz
euandre.org-9eb58da4307e39556ec600f581dbf49ef3a6c188.tar.xz
Adapt add-anchor-to-header-from-header-id to handle <hn><a></a></hn>
Now the hook creates a wrapping <span> to put the header and it's existing link inside, and add the new anchor as a sibling.
Diffstat (limited to '')
-rw-r--r--_plugins/add-anchor-to-header-from-header-id.rb2
-rw-r--r--styles.css18
2 files changed, 16 insertions, 4 deletions
diff --git a/_plugins/add-anchor-to-header-from-header-id.rb b/_plugins/add-anchor-to-header-from-header-id.rb
index 25829a2..d0df4d6 100644
--- a/_plugins/add-anchor-to-header-from-header-id.rb
+++ b/_plugins/add-anchor-to-header-from-header-id.rb
@@ -3,7 +3,7 @@ Jekyll::Hooks.register [:documents, :pages], :post_render do |doc|
doc.output =
doc.output.gsub(
/<h([1-6])(.*?)id="([\w-]+)"(.*?)>(.*?)<\/h[1-6]>/,
- '<a class="header-anchor" id="\3-header-anchor" href="#\3"><h\1\2id="\3"\4>\5<img class="simple-icon" src="/images/link.svg" aria-hidden="true" /></h\1></a>'
+ '<span class="header-anchor"><h\1\2id="\3"\4>\5</h\1><a href="#\3"><img class="simple-icon" src="/images/link.svg" aria-hidden="true" /></a></span>'
)
end
end
diff --git a/styles.css b/styles.css
index 68444ae..97a3a0f 100644
--- a/styles.css
+++ b/styles.css
@@ -112,15 +112,27 @@ a.code-line-anchor:hover {
/* Header anchor */
-a.header-anchor {
+span.header-anchor {
color: black;
text-decoration: none;
+ display: block;
+ margin-bottom: 15px;
}
-a.header-anchor img {
+span.header-anchor h1,
+span.header-anchor h2,
+span.header-anchor h3,
+span.header-anchor h4,
+span.header-anchor h5,
+span.header-anchor h6 {
+ display: inline;
+}
+
+
+span.header-anchor img {
visibility: hidden;
}
-a.header-anchor:hover img {
+span.header-anchor:hover img {
visibility: visible;
}