Adding buttons to market
This commit is contained in:
@@ -19,7 +19,6 @@ css(`
|
||||
|
||||
input[type="checkbox"]:checked {
|
||||
background-color: var(--red);
|
||||
|
||||
}
|
||||
`)
|
||||
|
||||
@@ -29,6 +28,7 @@ class Market extends Shadow {
|
||||
ZStack(() => {
|
||||
HStack(() => {
|
||||
VStack(() => {
|
||||
|
||||
HStack(() => {
|
||||
input()
|
||||
.attr({
|
||||
@@ -41,6 +41,7 @@ class Market extends Shadow {
|
||||
})
|
||||
.marginLeft(0.5, em)
|
||||
})
|
||||
|
||||
HStack(() => {
|
||||
input()
|
||||
.attr({
|
||||
@@ -53,6 +54,32 @@ class Market extends Shadow {
|
||||
})
|
||||
.marginLeft(0.5, em)
|
||||
})
|
||||
|
||||
HStack(() => {
|
||||
input()
|
||||
.attr({
|
||||
"type": "checkbox",
|
||||
"id": "new-check"
|
||||
})
|
||||
label("New")
|
||||
.attr({
|
||||
"for": "new-check"
|
||||
})
|
||||
.marginLeft(0.5, em)
|
||||
})
|
||||
|
||||
HStack(() => {
|
||||
input()
|
||||
.attr({
|
||||
"type": "checkbox",
|
||||
"id": "used-check"
|
||||
})
|
||||
label("Used")
|
||||
.attr({
|
||||
"for": "used-check"
|
||||
})
|
||||
.marginLeft(0.5, em)
|
||||
})
|
||||
})
|
||||
.paddingLeft(3, em)
|
||||
.gap(1, em)
|
||||
@@ -66,7 +93,7 @@ class Market extends Shadow {
|
||||
.transform("translate(-50%, -50%)")
|
||||
|
||||
HStack(() => {
|
||||
input("Search for products...", "50vw")
|
||||
input("Search for products...", "45vw")
|
||||
.attr({
|
||||
"type": "text"
|
||||
})
|
||||
@@ -77,6 +104,7 @@ class Market extends Shadow {
|
||||
.outline("none")
|
||||
.color("var(--accent)")
|
||||
.borderRadius(10, px)
|
||||
|
||||
button("Search")
|
||||
.marginLeft(2, em)
|
||||
.borderRadius(10, px)
|
||||
@@ -84,8 +112,18 @@ class Market extends Shadow {
|
||||
.border("1px solid var(--accent)")
|
||||
.color("var(--accent)")
|
||||
.fontFamily("Bona Nova")
|
||||
|
||||
button("+ Add Item")
|
||||
.width(7, em)
|
||||
.marginLeft(1, em)
|
||||
.borderRadius(10, px)
|
||||
.background("transparent")
|
||||
.border("1px solid var(--accent)")
|
||||
.color("var(--accent)")
|
||||
.fontFamily("Bona Nova")
|
||||
|
||||
})
|
||||
.x(50, vw).y(5, vh)
|
||||
.x(55, vw).y(5, vh)
|
||||
.position("absolute")
|
||||
.transform("translateX(-50%)")
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user