Compare commits
3 commits
06eecff942
...
3a4d95ea77
| Author | SHA1 | Date | |
|---|---|---|---|
| 3a4d95ea77 | |||
| 8622392944 | |||
| fc26a54f5e |
3 changed files with 18 additions and 9 deletions
|
|
@ -2,10 +2,6 @@
|
|||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta
|
||||
name="generator"
|
||||
content="HTML Tidy for HTML5 for Apple macOS version 5.8.0"
|
||||
/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>The Tough Guide to Fantasyland</title>
|
||||
<link rel="stylesheet" href="style.css" inline />
|
||||
|
|
@ -8731,7 +8727,7 @@
|
|||
<p>
|
||||
<span class="none2">OFFSHORE ISLANDS</span>
|
||||
<span class="none3"
|
||||
>exist in some quantity, some hav i ng human
|
||||
>exist in some quantity, some having human
|
||||
inhabitants, and one at least being the abode of
|
||||
DRAGONS.</span
|
||||
>
|
||||
|
|
|
|||
15
script.js
15
script.js
|
|
@ -344,13 +344,20 @@ tocList?.addEventListener("click", (e) => {
|
|||
}
|
||||
});
|
||||
|
||||
// scroll TOC item into view when navigating via hash
|
||||
window.addEventListener("hashchange", () => {
|
||||
// highlight active TOC entry based on hash
|
||||
const updateActiveTocEntry = () => {
|
||||
const id = location.hash.slice(1);
|
||||
tocList?.querySelector("a.active")?.classList.remove("active");
|
||||
if (id) {
|
||||
tocList?.querySelector(`a[href="#${id}"]`)?.scrollIntoView({ block: "nearest" });
|
||||
const link = tocList?.querySelector(`a[href="#${id}"]`);
|
||||
link?.classList.add("active");
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
window.addEventListener("hashchange", updateActiveTocEntry);
|
||||
if (location.hash) {
|
||||
updateActiveTocEntry();
|
||||
}
|
||||
|
||||
// Entry popup preview on hover
|
||||
const popup = document.createElement("div");
|
||||
|
|
|
|||
|
|
@ -151,6 +151,12 @@ body {
|
|||
color: var(--accent-deep);
|
||||
}
|
||||
|
||||
.toc-list a.active {
|
||||
background: rgba(182, 82, 47, 0.22);
|
||||
color: var(--accent-deep);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.content {
|
||||
background: rgba(255, 255, 255, 0.6);
|
||||
border-radius: clamp(12px, 3vw, 24px);
|
||||
|
|
|
|||
Loading…
Reference in a new issue