SearchBar component + Jobs changes + Events changes

- Added SearchBar.js to components (repeated in Jobs and Events)
- Set .position("relative") on AppWindow for LoadingCircles and future fixed/absolute elements
- Refactored Events.js and Jobs.js
- Added unfinished JobForm.js for editing/adding Jobs, preliminary designs/setup

src/apps/Jobs/Jobs.js

@@ -1,6 +1,8 @@
 import "./JobsSidebar.js"
 import "./JobsGrid.js"
 import "./JobCard.js"
+import "./JobForm.js"
+import "../../components/SearchBar.js"
 
 css(`
     jobs- {
@@ -43,45 +45,28 @@ class Jobs extends Shadow {
                 .margin(0)
                 .fontFamily("Bona")
 
-            input("Search (coming soon!)", "80%")
-                .attr({
-                    "type": "text",
-                    "disabled": "true"
-                })
-                .paddingVertical(0.75, em)
-                .boxSizing("border-box")
-                .paddingHorizontal(1, em)
-                .color("var(--accent)")
-                .background("#fff1dd")
-                .marginTop(0.75, em)
-                .marginBottom(1, em)
-                .border("1px solid black")
-                .borderRadius(100, px)
-                .fontFamily("Arial")
-                .fontSize(1, em)
-                .outline("none")
-                .cursor("not-allowed")
+            // JobForm()
 
-                if (this.jobs == "") {
-                    LoadingCircle()
-                } else if (this.jobs.length > 0) {
-                    for (let i = 0; i < this.jobs.length; i++) {
-                        JobCard(this.jobs[i])
-                            .borderTop(i == 0 ? "1px solid var(--divider)" : "")
-                    }
-                } else {
-                    h2("No Jobs")
-                        .color("var(--brown)")
-                        .fontWeight("bold")
-                        .marginTop(7.5, em)
-                        .marginBottom(0.5, em)
-                        .textAlign("center")
+            SearchBar()
+
+            if (this.jobs == "") {
+                LoadingCircle()
+            } else if (this.jobs.length > 0) {
+                for (let i = 0; i < this.jobs.length; i++) {
+                    JobCard(this.jobs[i])
+                        .borderTop(i == 0 ? "1px solid var(--divider)" : "")
                 }
+            } else {
+                h2("No Jobs")
+                    .color("var(--brown)")
+                    .fontWeight("bold")
+                    .marginTop(7.5, em)
+                    .marginBottom(0.5, em)
+                    .textAlign("center")
+            }
         })
-        .position("relative")
         .boxSizing("border-box")
         .paddingVertical(1, em)
-        .horizontalAlign("center")
         .height(100, pct)
         .width(100, pct)
     }