adding some market elements

This commit is contained in:
metacryst
2025-10-29 22:27:56 -05:00
parent 759ee54c32
commit 9dec94e58e
6 changed files with 144 additions and 58 deletions

View File

@@ -9,6 +9,11 @@ class Forum extends Shadow {
render() {
ZStack(() => {
p("Coming Soon!")
.position("absolute")
.x(50, vw).y(50, vh)
.transform("translate(-50%, -50%)")
HStack(() => {
input("Search...", "50vw")
.attr({

View File

@@ -1,14 +1,70 @@
css(`
market- {
font-family: 'Bona';
}
market- input::placeholder {
font-family: 'Bona Nova';
font-size: 0.9em;
color: var(--accent);
}
input[type="checkbox"] {
appearance: none; /* remove default style */
-webkit-appearance: none;
width: 1em;
height: 1em;
border: 1px solid var(--accent);
}
input[type="checkbox"]:checked {
background-color: var(--red);
}
`)
class Market extends Shadow {
render() {
ZStack(() => {
HStack(() => {
VStack(() => {
HStack(() => {
input()
.attr({
"type": "checkbox",
"id": "hyperia-check"
})
label("Hyperia-Made")
.attr({
"for": "hyperia-check"
})
.marginLeft(0.5, em)
})
HStack(() => {
input()
.attr({
"type": "checkbox",
"id": "america-check"
})
label("America-Made")
.attr({
"for": "america-check"
})
.marginLeft(0.5, em)
})
})
.paddingLeft(3, em)
.gap(1, em)
})
.width(100, "%")
.x(0).y(25, vh)
p("0 Items")
.position("absolute")
.x(50, vw).y(50, vh)
.transform("translate(-50%, -50%)")
HStack(() => {
input("Search for products...", "50vw")
.attr({
@@ -27,6 +83,7 @@ class Market extends Shadow {
.background("transparent")
.border("1px solid var(--accent)")
.color("var(--accent)")
.fontFamily("Bona Nova")
})
.x(50, vw).y(5, vh)
.position("absolute")

View File

@@ -9,6 +9,11 @@ class Messages extends Shadow {
render() {
ZStack(() => {
p("Coming Soon!")
.position("absolute")
.x(50, vw).y(50, vh)
.transform("translate(-50%, -50%)")
HStack(() => {
input("Search...", "50vw")
.attr({