Improving the 3 apps

ui/site/apps/Jobs/JobsGrid.js

@@ -0,0 +1,43 @@
+class JobsGrid extends Shadow {
+    jobs;
+
+    constructor(jobs) {
+        super()
+        this.jobs = jobs
+    }
+
+    render() {
+        VStack(() => {
+            h3("Results")
+            .marginTop(0)
+            .marginBottom(1, em)
+            .marginLeft(0.4, em)
+            .color("var(--periwinkle)")
+
+            if (this.jobs.length > 0) {
+                ZStack(() => {
+                    for (let i = 0; i < this.jobs.length; i++) {
+                        p(this.jobs[i].title)
+                            .border("1px solid var(--periwinkle)")
+                            .padding(1, em)
+                            .borderRadius(5, "px")
+                        }
+                })
+                .display("grid")
+                .gridTemplateColumns("repeat(auto-fill, minmax(200px, 1fr))")
+                .gap(1, em)
+            } else {
+                p("No Jobs!")
+            }
+        })
+        .height(100, vh)
+        .paddingLeft(2, em)
+        .paddingRight(2, em)
+        .paddingTop(2, em)
+        .gap(0, em)
+        .width(100, "%")
+        .borderTop("1px solid var(--periwinkle)")
+    }
+}
+
+register(JobsGrid)