updated nav bar & some styling
This commit is contained in:
+7
-1
@@ -17,7 +17,13 @@
|
|||||||
{
|
{
|
||||||
"icon": "powerplates_8x8.png",
|
"icon": "powerplates_8x8.png",
|
||||||
"action": "navigate",
|
"action": "navigate",
|
||||||
"actionValue": "/powerplates"
|
"actionValue": "/powerplates",
|
||||||
|
"alt": {
|
||||||
|
"name": "byte",
|
||||||
|
"icon": "dice3_8x8.png",
|
||||||
|
"action": "navigate",
|
||||||
|
"actionValue": "/"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"icon": "pauseAnimation_8x8.png",
|
"icon": "pauseAnimation_8x8.png",
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
const PAGES = {
|
const PAGES = {
|
||||||
null: -1,
|
null: -1,
|
||||||
SYNTHWAVE: 0,
|
SYNTHWAVE: 0,
|
||||||
|
LICENSE: 1,
|
||||||
}
|
}
|
||||||
const CONSOLE_COLORS = {
|
const CONSOLE_COLORS = {
|
||||||
red: "color: #FF0000;",
|
red: "color: #FF0000;",
|
||||||
|
|||||||
@@ -11,6 +11,9 @@
|
|||||||
html {
|
html {
|
||||||
font-family: "Roboto", sans-serif;
|
font-family: "Roboto", sans-serif;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
|
color: #ffffff;
|
||||||
|
background-color: #323232;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
canvas {
|
canvas {
|
||||||
|
|||||||
@@ -40,4 +40,5 @@
|
|||||||
word-break: break-word;
|
word-break: break-word;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
color: #ffffff;
|
||||||
}
|
}
|
||||||
+14
-2
@@ -1,7 +1,10 @@
|
|||||||
let navBarJson
|
let navBarJson
|
||||||
|
let alts
|
||||||
|
|
||||||
function onLoadNavBar() {
|
function onLoadNavBar() {
|
||||||
const container = document.getElementById("navBarContainer")
|
const container = document.getElementById("navBarContainer")
|
||||||
|
const altString = container.dataset.alt || ""
|
||||||
|
alts = altString.replace(" ", "").split(",")
|
||||||
|
|
||||||
if (!container) { return }
|
if (!container) { return }
|
||||||
|
|
||||||
@@ -17,7 +20,8 @@ function onLoadNavBar() {
|
|||||||
btn["icon"] || "",
|
btn["icon"] || "",
|
||||||
btn["action"] || "",
|
btn["action"] || "",
|
||||||
btn["actionValue"] || "",
|
btn["actionValue"] || "",
|
||||||
btn["iconId"] || ""
|
btn["iconId"] || "",
|
||||||
|
btn["alt"] || ""
|
||||||
))
|
))
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -25,7 +29,14 @@ function onLoadNavBar() {
|
|||||||
container.appendChild(navBarAligner)
|
container.appendChild(navBarAligner)
|
||||||
}
|
}
|
||||||
|
|
||||||
function createNavBarBtn(icon = "", action = "", actionValue = "", iconId = "") {
|
function createNavBarBtn(icon = "", action = "", actionValue = "", iconId = "", alt = "", hidden = "") {
|
||||||
|
if (alts.includes(alt["name"])) {
|
||||||
|
icon = alt["icon"] || ""
|
||||||
|
action = alt["action"] || ""
|
||||||
|
actionValue = alt["actionValue"] || ""
|
||||||
|
iconId = alt["iconId"] || ""
|
||||||
|
}
|
||||||
|
|
||||||
let onClick
|
let onClick
|
||||||
switch (action) {
|
switch (action) {
|
||||||
case "navigate": onClick = `slideTransition('${actionValue}')`; break
|
case "navigate": onClick = `slideTransition('${actionValue}')`; break
|
||||||
@@ -34,6 +45,7 @@ function createNavBarBtn(icon = "", action = "", actionValue = "", iconId = "")
|
|||||||
}
|
}
|
||||||
|
|
||||||
let btn = document.createElement("li")
|
let btn = document.createElement("li")
|
||||||
|
|
||||||
btn.innerHTML = `
|
btn.innerHTML = `
|
||||||
<button onclick="${onClick}" class="navBtn">
|
<button onclick="${onClick}" class="navBtn">
|
||||||
<img class="navBtnImg" draggable="false" src="/assets/navBarBtn.png">
|
<img class="navBtnImg" draggable="false" src="/assets/navBarBtn.png">
|
||||||
|
|||||||
Reference in New Issue
Block a user