Styling improvements

ui/desktop/Home.js

@@ -21,6 +21,7 @@ class Home extends Shadow {
                     option("Light").attr({value: "light"})
                     option("Dark").attr({value: "dark"})
                     option("Red").attr({value: "red"})
+                    option("Parchment").attr({value: "parchment"})
 
                     $(`option[value=${selected}]`).selected = "true"
                 })

ui/desktop/apps/Settings/Settings.js

@@ -21,16 +21,16 @@ class Settings extends Shadow {
                 .marginLeft(5, pct)
 
             VStack(() => {
-                HStack(() => {
-                    p("Stripe Integration")
-                    button("Set up Stripe")
-                        .maxWidth(10, em)
-                        .onClick((done) => {
-                            this.handleConnectStripe()
-                        })
-                })
-                .gap(10, pct)
-                .verticalAlign("center")
+                // HStack(() => {
+                //     p("Stripe Integration")
+                //     button("Set up Stripe")
+                //         .maxWidth(10, em)
+                //         .onClick((done) => {
+                //             this.handleConnectStripe()
+                //         })
+                // })
+                // .gap(10, pct)
+                // .verticalAlign("center")
             })
             .gap(0.5, em)
             .paddingLeft(5, pct)

ui/desktop/components/AppMenu.js

@@ -59,7 +59,6 @@ class AppMenu extends Shadow {
         .width(100, vw)
         .height(2.5, em)
         .paddingVertical(0.7, em)
-        .borderTop("1px solid var(--accent)")
     }
 }
 

ui/desktop/components/AppWindow.js

@@ -37,9 +37,11 @@ class AppWindow extends Shadow {
         })
         .overflow("scroll")
         .position("absolute")
-        .width(window.innerWidth - this.calculateWidth(), px)
-        .height(window.innerHeight - this.calculateHeight(), px)
-        .background("var(--app)")
+        .width(window.innerWidth - this.calculateWidth() + 10, px)
+        .height(window.innerHeight - this.calculateHeight() + 10, px)
+        .borderRadius(15, px)
+        .boxShadow("rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px")
+        .background("var(--window)")
         .x(this.calculateWidth(), px)
         .yBottom(this.calculateHeight(), px)
         .onEvent("resize", () => {

ui/desktop/components/Sidebar.js

@@ -62,7 +62,6 @@ class Sidebar extends Shadow {
         .position("fixed")
         .x(0).y(0)
         .height(100, vh)
-        .borderRight("1px solid var(--accent)")
         .zIndex(3)
         .onEvent("themechange", () => {
             console.log("why is this needed smg")