77 lines
2.5 KiB
JavaScript
77 lines
2.5 KiB
JavaScript
class AppMenu extends Shadow {
|
|
selected = ""
|
|
|
|
onNewSelection() {
|
|
this.$$("img").forEach((image) => {
|
|
image.style.background = ""
|
|
})
|
|
}
|
|
|
|
render() {
|
|
console.log("rendering")
|
|
HStack(() => {
|
|
img("/_/icons/Column.svg", "1.5em", "1.5em")
|
|
.attr({app: "forum"})
|
|
.padding(0.5, em)
|
|
.borderRadius(10, px)
|
|
.onAppear(function () {
|
|
this.style.border = "1px solid black"
|
|
})
|
|
.onClick((finished, e) => {
|
|
if(finished) {
|
|
this.onNewSelection()
|
|
}
|
|
e.target.style.background = "var(--accent)"
|
|
console.log(e.target, e.target.style.background)
|
|
if(finished) {
|
|
window.navigateTo("/")
|
|
}
|
|
})
|
|
img("/_/icons/letter.svg", "1.5em", "1.5em")
|
|
.attr({app: "messages"})
|
|
.padding(0.5, em)
|
|
.borderRadius(10, px)
|
|
.onAppear(function () {
|
|
this.style.border = "1px solid black"
|
|
})
|
|
.onClick((finished, e) => {
|
|
if(finished) {
|
|
this.onNewSelection()
|
|
}
|
|
e.target.style.background = "rgb(112 150 114)"
|
|
if(finished) {
|
|
window.navigateTo("/messages")
|
|
}
|
|
})
|
|
img("/_/icons/jobs.svg", "1.5em", "1.5em")
|
|
.attr({app: "jobs"})
|
|
.padding(0.5, em)
|
|
.borderRadius(10, px)
|
|
.onAppear(function () {
|
|
this.style.border = "1px solid black"
|
|
})
|
|
.onClick((finished, e) => {
|
|
if(finished) {
|
|
this.onNewSelection()
|
|
}
|
|
e.target.style.background = "#9392bb"
|
|
if(finished) {
|
|
window.navigateTo("/jobs")
|
|
}
|
|
})
|
|
})
|
|
.borderTop("1px solid black")
|
|
.height("auto")
|
|
.position('fixed')
|
|
.background("var(--main)")
|
|
.zIndex(1)
|
|
.x(0).yBottom(0)
|
|
.justifyContent("space-between")
|
|
.paddingHorizontal(4, em)
|
|
.paddingVertical(1, em)
|
|
.width(100, vw)
|
|
.boxSizing("border-box")
|
|
}
|
|
}
|
|
|
|
register(AppMenu) |