More aesthetic improvements
This commit is contained in:
@@ -47,34 +47,21 @@ class Jobs extends Shadow {
|
||||
.x(0).y(13, vh)
|
||||
|
||||
HStack(() => {
|
||||
input("Search jobs...", "45vw")
|
||||
input("Search jobs... (Coming Soon!)", "45vw")
|
||||
.attr({
|
||||
"type": "text"
|
||||
"type": "text",
|
||||
"disabled": "true"
|
||||
})
|
||||
.fontSize(1.1, em)
|
||||
.paddingLeft(1.3, em)
|
||||
.background("transparent")
|
||||
.border("0.3px solid var(--accent2)")
|
||||
.border("0.5px solid var(--divider)")
|
||||
.outline("none")
|
||||
.color("var(--accent)")
|
||||
.opacity(0.5)
|
||||
.borderRadius(10, px)
|
||||
|
||||
button("Search")
|
||||
.marginLeft(2, em)
|
||||
.borderRadius(10, px)
|
||||
.background("transparent")
|
||||
.border("0.3px solid var(--accent2)")
|
||||
.color("var(--accent)")
|
||||
.fontFamily("Bona Nova")
|
||||
.onHover(function (hovering) {
|
||||
if(hovering) {
|
||||
this.style.background = "var(--green)"
|
||||
|
||||
} else {
|
||||
this.style.background = "transparent"
|
||||
|
||||
}
|
||||
})
|
||||
.background("grey")
|
||||
.cursor("not-allowed")
|
||||
|
||||
button("+ Add Job")
|
||||
.width(7, em)
|
||||
|
||||
@@ -51,34 +51,21 @@ class Market extends Shadow {
|
||||
.x(0).y(13, vh)
|
||||
|
||||
HStack(() => {
|
||||
input("Search for products...", "45vw")
|
||||
input("Search for products... (Coming Soon!)", "45vw")
|
||||
.attr({
|
||||
"type": "text"
|
||||
"type": "text",
|
||||
"disabled": "true"
|
||||
})
|
||||
.fontSize(1.1, em)
|
||||
.paddingLeft(1.3, em)
|
||||
.background("transparent")
|
||||
.border("0.5px solid var(--accent2)")
|
||||
.border("0.5px solid var(--divider)")
|
||||
.outline("none")
|
||||
.color("var(--accent)")
|
||||
.opacity(0.5)
|
||||
.borderRadius(10, px)
|
||||
|
||||
button("Search")
|
||||
.marginLeft(2, em)
|
||||
.borderRadius(10, px)
|
||||
.background("transparent")
|
||||
.border("0.5px solid var(--accent2)")
|
||||
.color("var(--accent)")
|
||||
.fontFamily("Bona Nova")
|
||||
.onHover(function (hovering) {
|
||||
if(hovering) {
|
||||
this.style.background = "var(--green)"
|
||||
|
||||
} else {
|
||||
this.style.background = "transparent"
|
||||
|
||||
}
|
||||
})
|
||||
.background("grey")
|
||||
.cursor("not-allowed")
|
||||
|
||||
button("+ Add Item")
|
||||
.width(7, em)
|
||||
|
||||
@@ -97,10 +97,47 @@ class Messages extends Shadow {
|
||||
.height(87, vh)
|
||||
.x(0).y(13, vh)
|
||||
|
||||
VStack(() => {
|
||||
p("Add Message")
|
||||
|
||||
input("enter email...")
|
||||
.color("var(--accent)")
|
||||
.onKeyDown(function (e) {
|
||||
if (e.key === "Enter") {
|
||||
window.Socket.send({app: "MESSAGES", operation: "ADDCONVERSATION", msg: {email: this.value }})
|
||||
this.value = ""
|
||||
}
|
||||
})
|
||||
|
||||
p("x")
|
||||
.onClick(function (done) {
|
||||
if(done) {
|
||||
this.parentElement.style.display = "none"
|
||||
}
|
||||
})
|
||||
.xRight(2, em).y(2, em)
|
||||
.fontSize(1.4, em)
|
||||
.cursor("pointer")
|
||||
|
||||
})
|
||||
.gap(1, em)
|
||||
.alignVertical("center")
|
||||
.alignHorizontal("center")
|
||||
.backgroundColor("black")
|
||||
.border("1px solid var(--accent)")
|
||||
.position("fixed")
|
||||
.x(50, vw).y(50, vh)
|
||||
.center()
|
||||
.width(60, vw)
|
||||
.height(60, vh)
|
||||
.display("none")
|
||||
.attr({id: "addPanel"})
|
||||
|
||||
HStack(() => {
|
||||
input("Search messages...", "45vw")
|
||||
input("Search messages... (Coming Soon!)", "45vw")
|
||||
.attr({
|
||||
"type": "text"
|
||||
"type": "text",
|
||||
"disabled": "true"
|
||||
})
|
||||
.fontSize(1.1, em)
|
||||
.paddingLeft(1.3, em)
|
||||
@@ -108,24 +145,10 @@ class Messages extends Shadow {
|
||||
.border("0.5px solid var(--divider)")
|
||||
.outline("none")
|
||||
.color("var(--accent)")
|
||||
.opacity(0.5)
|
||||
.borderRadius(10, px)
|
||||
|
||||
button("Search")
|
||||
.marginLeft(2, em)
|
||||
.borderRadius(10, px)
|
||||
.background("transparent")
|
||||
.border("0.5px solid var(--divider)")
|
||||
.color("var(--accent)")
|
||||
.fontFamily("Bona Nova")
|
||||
.onHover(function (hovering) {
|
||||
if(hovering) {
|
||||
this.style.background = "var(--green)"
|
||||
|
||||
} else {
|
||||
this.style.background = "transparent"
|
||||
|
||||
}
|
||||
})
|
||||
.background("grey")
|
||||
.cursor("not-allowed")
|
||||
|
||||
button("+ New Message")
|
||||
.width(13, em)
|
||||
@@ -144,7 +167,11 @@ class Messages extends Shadow {
|
||||
|
||||
}
|
||||
})
|
||||
.onClick((clicking) => {
|
||||
.onClick((done) => {
|
||||
console.log("click")
|
||||
if(done) {
|
||||
this.$("#addPanel").style.display = "flex"
|
||||
}
|
||||
console.log(this, "clicked")
|
||||
})
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
class ProfileMenu extends Shadow {
|
||||
|
||||
render() {
|
||||
ZStack(() => {
|
||||
VStack(() => {
|
||||
h2("Profile")
|
||||
|
||||
HStack(() => {
|
||||
@@ -27,13 +27,13 @@ class ProfileMenu extends Shadow {
|
||||
.xRight(2, em).y(1, em)
|
||||
})
|
||||
.paddingLeft(1, em)
|
||||
.color("var(--main)")
|
||||
.color("var(--accent)")
|
||||
.position("fixed")
|
||||
.border("1px solid var(--main)")
|
||||
.border("1px solid var(--accent)")
|
||||
.x(50, vw).y(47, vh)
|
||||
.width(70, vw)
|
||||
.height(70, vh)
|
||||
.backgroundColor("var(--accent)")
|
||||
.backgroundColor("black")
|
||||
.center()
|
||||
.display("none")
|
||||
.onAppear(async () => {
|
||||
|
||||
Reference in New Issue
Block a user