added anchors to headers using anchor.js

This commit is contained in:
evebyte 2022-12-07 17:03:50 -07:00
parent a542949e4a
commit baf38f9fd5
2 changed files with 22 additions and 0 deletions

View File

@ -58,6 +58,15 @@ pre {
nav > ul > li > a:focus, [aria-hidden="true"] > a { box-shadow: none; }
a:focus { box-shadow: 0 0 0 3px {{ site.colors.purple }}cc; }
/* creates an invisible pseudo-element to adjust for the fixed navbar so the anchors takes you to a location above the link */
:target::before {
content: "";
display: block;
margin-top: -80px;
height: 80px;
width: 1px;
}
/* ----- base elements ----- */
img {

View File

@ -59,5 +59,18 @@
</div>
</div>
<script src="site.js"></script>
<script src="https://cdn.jsdelivr.net/npm/anchor-js/anchor.min.js"></script>
<script>
// configure options for anchors
anchors.options = {
placement: "left",
};
// add anchors to all h2, h3, h4, h5, h6
anchors
.add()
// remove anchors from the following elements
.remove("#free-libre-open-source-software-binaries-of-vs-code");
</script>
</body>
</html>