Improve nav, fix some inconsistencies

This commit is contained in:
Florine W. Dekker 2022-11-19 17:20:35 +01:00
parent 04095848c2
commit 8d5b6ef101
Signed by: FWDekker
GPG Key ID: D3DCFAA8A4560BE0
4 changed files with 28 additions and 5 deletions

View File

@ -23,6 +23,18 @@ a[target="_blank"]::after {
display: none !important;
}
@media (min-width: 576px) {
.hidden-no-mobile {
display: none;
}
}
@media (max-width: 576px) {
.hidden-on-mobile {
display: none;
}
}
/* Input with button next to it */
.input-with-button {
display: flex;
@ -39,9 +51,17 @@ a[target="_blank"]::after {
}
/* Container with table of contents */
.container-with-toc {
display: grid;
grid-template-columns: 200px auto;
@media (min-width: 576px) {
.container-with-toc {
display: grid;
grid-template-columns: 200px auto;
}
}
@media (max-width: 576px) {
.container-with-toc aside {
margin-bottom: var(--block-spacing-vertical);
}
}

View File

@ -44,6 +44,7 @@ nav.fwd-nav #nav-hamburger-label {
}
nav.fwd-nav a[target="_blank"]::after {
margin-bottom: 0.2rem;
background-color: white;
}

View File

@ -108,7 +108,7 @@ const unpackEntry = function(entry, path = "/", highlightPath = "") {
if (entry.entries.length === 0)
return "" +
`<li ${shouldHighlight ? "class=\"currentPage\"" : ""}>` +
`<a href="${entry.link}" ${isExternalLink ? "class=\"external\"" : ""}>${entry.name}</a>` +
`<a href="${entry.link}" ${isExternalLink ? "target=\"_blank\"" : ""}>${entry.name}</a>` +
`</li>`;
const depth = path.split("/").length - 2; // -1 because count parts, then another -1 because of leading `/`
@ -178,7 +178,7 @@ const footer = function(
if (privacyPolicyURL === undefined) privacyPolicyURL = "https://fwdekker.com/privacy/";
return stringToHtml(
`<footer class="fwd-footer container">` +
`<footer class="fwd-footer">` +
`<hr />` +
`<small>` +
footerLink("Made by ", author, authorURL, ". ") +

View File

@ -34,10 +34,12 @@
<main class="container container-with-toc">
<aside>
<nav>
<b class="hidden-no-mobile">Table of contents</b>
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
<hr class="hidden-no-mobile" />
</nav>
</aside>
<div role="document">