lucielle/website
1
0
Fork 0
Code Issues Pull Requests Actions Releases Activity

Compare commits

base: lucielle:2d391dab212545561c0ea861585a2adc9610b5b5
Branches Tags
lucielle:main
..
compare: lucielle:70806b80eeb9c67be886ed689d3c4aa4ff7b4acb
Branches Tags
lucielle:main

2 Commits
2d391dab21 ... 70806b80ee

Author SHA1 Message Date
Lucielle
70806b80ee bottom navigation functionality 2025-12-02 11:46:59 -06:00
Lucielle
8af6ee7cd5 load bottomnav from js 2025-12-02 10:22:42 -06:00
7 changed files with 67 additions and 12 deletions
Expand all files Collapse all files

8
_bottomnav.html Normal file
View File

@@ -0,0 +1,8 @@
<div id="bottomnav">
<ul>
<li><a href="/">[/]</a></li>
<li><a href="/projects.html">[/projects]</a></li>
<li><a href="/links.html">[/links]</a></li>
</ul>
<span>PWD: [%PATH%]</span>
</div>

20
assets/index.css → assets/global.css
View File

@@ -38,16 +38,25 @@ main img {
#bottomnav { #bottomnav {
display: flex; display: flex;
/* width: 100dvw; */ justify-content: space-between;
list-style: none;
padding: 32px; padding: 32px;
margin: 0; margin: 0;
gap: 16px;
outline: 1px solid black; outline: 1px solid black;
} }
#bottomnav span {
align-self: center;
}
#bottomnav ul {
display: flex;
flex-direction: row;
list-style: none;
padding: 0;
gap: 16px;
}
#bottomnav li { #bottomnav li {
padding: 0px; padding: 0px;
} }
@@ -64,7 +73,6 @@ main img {
} }
#bottomnav a:hover { #bottomnav a:hover {
cursor: not-allowed;
text-decoration: underline; text-decoration: underline;
background: black; background: black;

13
assets/global.js Normal file
View File

@@ -0,0 +1,13 @@
const parser = new DOMParser();
fetch("/_bottomnav.html")
.then(response => response.text())
.then(text => {
const bottomNavHTML = parser.parseFromString(text, "text/html");
const bottomNav = bottomNavHTML.getElementById("bottomnav");
const pathSpan = bottomNav.querySelector("span");
pathSpan.innerText = pathSpan.innerText.replace("%PATH%", document.location.pathname);
document.body.appendChild(bottomNav);
});

0
assets/index.js
View File

8
index.html
View File

@@ -4,7 +4,8 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Im bad at naming things</title> <title>Im bad at naming things</title>
<link rel="stylesheet" href="assets/index.css"> <link rel="stylesheet" href="assets/global.css">
<script src="assets/global.js" defer></script>
</head> </head>
<body> <body>
<main> <main>
@@ -13,10 +14,5 @@
Lucielle Lucielle
</div> </div>
</main> </main>
<ul id="bottomnav">
<li><a href="/">[/]</a></li>
<li><a href="#">[/projects]</a></li>
<li><a href="#">[/links]</a></li>
</ul>
</body> </body>
</html> </html>

15
links.html Normal file
View File

@@ -0,0 +1,15 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Links are pretty cool</title>
<link rel="stylesheet" href="assets/global.css">
<script src="assets/global.js" defer></script>
</head>
<body>
<main>
</main>
</body>
</html>

15
projects.html Normal file
View File

@@ -0,0 +1,15 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Projects 'n' stuff</title>
<link rel="stylesheet" href="assets/global.css">
<script src="assets/global.js" defer></script>
</head>
<body>
<main>
</main>
</body>
</html>