From 0ea6ac76134e957a998a27bbb357f392d68a70fd Mon Sep 17 00:00:00 2001
From: weru <fromweru@gmail.com>
Date: Thu, 11 Jul 2024 16:50:24 +0000
Subject: [PATCH] use hugo markdown renderer for deep links
---
layouts/partials/sprites.html | 6 ++++++
assets/js/index.js | 27 +--------------------------
exampleSite/netlify.toml | 2 +-
layouts/_default/_markup/render-heading.html | 8 ++++++++
assets/sass/_utils.sass | 5 +++--
5 files changed, 19 insertions(+), 29 deletions(-)
diff --git a/assets/js/index.js b/assets/js/index.js
index 858b14a..8923fc4 100644
--- a/assets/js/index.js
+++ b/assets/js/index.js
@@ -170,37 +170,13 @@
return url
}
-function createDeepLinks() {
- let heading_nodes = [];
-
- [...Array(6).keys()].forEach(function(i){
- if(i) {
- Array.prototype.push.apply(heading_nodes, document.getElementsByTagName(`h${i+1}`));
- }
- });
-
- heading_nodes.forEach(node => {
- let link = createEl('a');
- let icon = createEl('img');
- icon.src = '{{ absURL "icons/link.svg" }}';
- link.className = 'link icon';
- link.appendChild(icon);
- let id = node.getAttribute('id');
- if(id) {
- link.href = `${sanitizeURL(document.URL)}#${id}`;
- node.appendChild(link);
- pushClass(node, 'link_owner');
- }
- });
-}
-
function copyFeedback(parent) {
const copy_txt = document.createElement('div');
const yanked = 'link_yanked';
copy_txt.classList.add(yanked);
copy_txt.innerText = copied_text;
if(!elem(`.${yanked}`, parent)) {
- const icon = parent.getElementsByTagName('img')[0];
+ const icon = parent.getElementsByTagName('svg')[0];
const original_src = icon.src;
icon.src = '{{ absURL "icons/check.svg" }}';
parent.appendChild(copy_txt);
@@ -269,7 +245,6 @@
updateDate();
customizeSidebar();
markExternalLinks();
- createDeepLinks();
copyHeadingLink();
makeTablesResponsive();
backToTop();
diff --git a/assets/sass/_utils.sass b/assets/sass/_utils.sass
index 25607af..f712c9b 100644
--- a/assets/sass/_utils.sass
+++ b/assets/sass/_utils.sass
@@ -85,16 +85,17 @@
display: inline-flex
align-items: center
width: 2.5rem
- margin: 0 0.25rem
+ margin: 0 0.25rem 0 0
padding: 0 0.25rem
opacity: 0
+ transform: translate(-0.33rem, 0.33rem)
transition: opacity 0.3s cubic-bezier(0.39, 0.575, 0.565, 1)
svg, img
width: 1.5rem
height: 1.5rem
fill: var(--theme)
&_owner:hover &
- opacity: 0.9
+ opacity: 1
.copy
cursor: pointer
diff --git a/exampleSite/netlify.toml b/exampleSite/netlify.toml
index 93624f4..23a675b 100644
--- a/exampleSite/netlify.toml
+++ b/exampleSite/netlify.toml
@@ -1,7 +1,7 @@
[build]
publish = "public"
#command = "hugo --gc --minify"
-command = "tinacms build && hugo --gc --minify --baseURL https://composedocs.netlify.app/"
+command = "hugo --gc --minify --baseURL https://composedocs.netlify.app/"
[context.production.environment]
HUGO_VERSION = "0.128.2"
diff --git a/layouts/_default/_markup/render-heading.html b/layouts/_default/_markup/render-heading.html
new file mode 100644
index 0000000..20e8ecf
--- /dev/null
+++ b/layouts/_default/_markup/render-heading.html
@@ -0,0 +1,8 @@
+<h{{ .Level }} id="{{ .Anchor }}" class=link_owner>
+ {{ .Text | safeHTML }}
+ <a href="#{{ .Anchor }}" class="link icon">
+ <svg>
+ <use xlink:href="#anchor-link"></use>
+ </svg>
+ </a>
+</h{{ .Level }}>
diff --git a/layouts/partials/sprites.html b/layouts/partials/sprites.html
index 4dc23b1..6104205 100644
--- a/layouts/partials/sprites.html
+++ b/layouts/partials/sprites.html
@@ -36,6 +36,12 @@
<path d="M11.429 24h4.57C15.999 15.179 8.821 8.001 0 8v4.572c6.302.001 11.429 5.126 11.429 11.428z"></path>
<path d="M24 24C24 10.766 13.234 0 0 0v4.571c10.714 0 19.43 8.714 19.43 19.429z"></path>
</symbol>
+ <symbol enable-background="new 0 0 64 64" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" id="anchor-link">
+ <g fill="var(--theme)">
+ <path d="m19 40c1.104 0 2-.896 2-2s-.896-2-2-2c-3.86 0-7-3.14-7-7 0-1.873.728-3.628 2.059-4.95 1.313-1.322 3.068-2.05 4.941-2.05h10c3.86 0 7 3.14 7 7 0 .258-.015.509-.048.78-.174 1.574-.885 3.052-2.017 4.176-.532.54-1.137.974-1.797 1.289-.997.476-1.419 1.669-.944 2.666.476.996 1.669 1.419 2.667.943 1.08-.516 2.063-1.219 2.908-2.075 1.763-1.75 2.885-4.08 3.156-6.539.051-.413.075-.819.075-1.24 0-6.065-4.935-11-11-11h-10c-2.947 0-5.709 1.147-7.77 3.221-2.083 2.07-3.23 4.832-3.23 7.779 0 6.065 4.935 11 11 11z"></path>
+ <path d="m45 28c-1.104 0-2 .896-2 2s.896 2 2 2c3.86 0 7 3.141 7 7 0 1.873-.728 3.628-2.059 4.95-1.313 1.322-3.068 2.05-4.941 2.05h-10c-3.86 0-7-3.141-7-7 0-.258.015-.509.048-.78.174-1.574.885-3.052 2.017-4.176.532-.54 1.136-.974 1.796-1.289.997-.476 1.419-1.67.944-2.667s-1.669-1.418-2.667-.944c-1.081.516-2.064 1.22-2.908 2.076-1.763 1.75-2.885 4.08-3.156 6.538-.05.415-.074.821-.074 1.242 0 6.065 4.935 11 11 11h10c2.946 0 5.709-1.147 7.77-3.221 2.083-2.07 3.23-4.833 3.23-7.779 0-6.065-4.935-11-11-11z"></path>
+ </g>
+ </symbol>
<symbol viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" id="linkedin">
<path d="M437 0H75C33.648 0 0 33.648 0 75v362c0 41.352 33.648 75 75 75h362c41.352 0 75-33.648 75-75V75c0-41.352-33.648-75-75-75zM181 406h-60V196h60zm0-240h-60v-60h60zm210 240h-60V286c0-16.54-13.46-30-30-30s-30 13.46-30 30v120h-60V196h60v11.309C286.719 202.422 296.93 196 316 196c40.691.043 75 36.547 75 79.688zm0 0"></path>
</symbol>
--
Gitblit v1.10.0