Mobile improvements

This commit is contained in:
metacryst
2025-12-17 22:16:38 -06:00
parent 279be987a4
commit 9567e4e284
16 changed files with 347 additions and 152 deletions

View File

@@ -30,70 +30,32 @@ class Forum extends Shadow {
render() {
ZStack(() => {
HStack(() => {
VStack(() => {
img("/_/icons/logo.svg", "2em")
.padding(0.8, em)
.borderRadius(12, px)
.marginHorizontal(1, em)
.onHover(function (hovering) {
if(hovering) {
this.style.background = "var(--darkbrown)"
} else {
this.style.background = ""
}
})
.opacity(0)
VStack(() => {
img("/_/icons/place/austin.svg", "2em")
.padding(0.8, em)
.borderRadius(12, px)
.marginHorizontal(1, em)
.onHover(function (hovering) {
if(hovering) {
this.style.background = "var(--darkbrown)"
} else {
this.style.background = ""
}
})
.opacity(0)
ForumPanel()
})
.height(100, vh)
.paddingLeft(2, em)
.paddingRight(2, em)
.gap(1, em)
.marginTop(20, vh)
VStack(() => {
ForumPanel()
input("Message Hyperia", "98%")
.paddingVertical(1, em)
.paddingLeft(2, pct)
.color("var(--accent)")
.background("var(--darkbrown)")
.marginBottom(6, em)
.border("none")
.fontSize(1, em)
.onKeyDown(function (e) {
if (e.key === "Enter") {
window.Socket.send({app: "FORUM", operation: "SEND", msg: {forum: "HY", text: this.value }})
this.value = ""
}
})
})
.gap(0.5, em)
.width(100, pct)
.height(100, vh)
.alignHorizontal("center")
.alignVertical("end")
input("Message Hyperia", "98%")
.paddingVertical(1, em)
.paddingLeft(2, pct)
.color("var(--accent)")
.background("var(--darkbrown)")
.marginBottom(6, em)
.border("none")
.fontSize(1, em)
.onKeyDown(function (e) {
if (e.key === "Enter") {
window.Socket.send({app: "FORUM", operation: "SEND", msg: {forum: "HY", text: this.value }})
this.value = ""
}
})
})
.width(100, "%")
.height(87, vh)
.x(0).y(0, vh)
.gap(0.5, em)
.width(100, pct)
.height(100, vh)
.alignHorizontal("center")
.alignVertical("end")
})
.onAppear(() => document.body.style.backgroundColor = "var(--darkbrown)")
.width(100, pct)
.height(100, pct)
}

View File

@@ -54,14 +54,12 @@ class ForumPanel extends Shadow {
.paddingLeft(4, pct)
.backgroundColor("var(--darkbrown)")
.onAppear(async () => {
console.log("appear")
requestAnimationFrame(() => {
this.scrollTop = this.scrollHeight
});
let res = await Socket.send({app: "FORUM", operation: "GET", msg: {forum: "HY", number: 100}})
if(!res) console.error("failed to get messages")
if(res.msg.length > 0 && this.messages.length === 0) {
console.log("rerendering", res.msg)
this.messages = res.msg
this.rerender()
}