add inter-work navigation

This commit is contained in:
41666 2023-10-10 12:31:53 -04:00
parent 23d7810ab6
commit dbc1fd7c17
11 changed files with 104 additions and 7 deletions

View file

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<meta charset="utf-8" />
<title>com.mekanoe.art // 001-platform-provenance</title>
<style>
@ -21,5 +21,8 @@
<main>
<canvas id="canvas" width="1280" height="720"></canvas>
<div id="telemetry">XX.X FPS (XX.X ms)</div>
<nav>
<a class="nav-right" href="/002-webgl-engine">002-webgl-engine ⇢</a>
</nav>
</main>
<script src="/001-platform-provenance/main.js" type="module"></script>

View file

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<meta charset="utf-8" />
<title>com.mekanoe.art // 002-webgl-engine</title>
<style>
@ -21,5 +21,11 @@
<main>
<canvas id="canvas" width="1280" height="720"></canvas>
<div id="telemetry">XX.X FPS (XX.X ms)</div>
<nav>
<a class="nav-left" href="/001-platform-provenance"
>⇠ 001-platform-provenance</a
>
<a class="nav-right" href="/003-scene">003-scene ⇢</a>
</nav>
</main>
<script src="/002-webgl-engine/main.js" type="module"></script>

View file

@ -21,5 +21,8 @@
<main>
<canvas id="canvas" width="1280" height="720"></canvas>
<div id="telemetry">XX.X FPS (XX.X ms)</div>
<nav>
<a class="nav-left" href="/002-webgl-engine">⇠ 002-webgl-engine</a>
</nav>
</main>
<script src="/003-scene/main.js" type="module"></script>

View file

@ -9,4 +9,36 @@
padding: 10px;
font-size: 12px;
display: none;
}
nav {
position: fixed;
z-index: 10;
display: flex;
bottom: 0;
left: 0;
right: 0;
padding: 3px;
& a {
display: block;
color: gold;
text-decoration: none;
transition: opacity ease-in-out 0.1s;
opacity: 0.3;
&:hover {
opacity: 1;
}
}
& .nav-left {
flex: 1;
text-align: left;
}
& .nav-right {
flex: 1;
text-align: right;
}
}