improve gradient

dist/index.css

@@ -38,8 +38,8 @@ main {
   background-image: radial-gradient(var(--color-1), var(--color-2));
 }
 #background-wrapper #grass-1 {
-  --color-1: hsl(120, 50%, 50%);
-  --color-2: hsl(120, 50%, 40%);
+  --color-1: hsl(150, 100%, 30%);
+  --color-2: hsl(150, 100%, 25%);
   background-image:
     linear-gradient(
       350deg,
@@ -52,25 +52,10 @@ main {
   --color-2: hsl(110, 100%, 35%);
   background-image:
     linear-gradient(
-      4deg,
+      9deg,
       var(--color-1),
-      var(--color-2) 25%,
-      transparent 30%);
-}
-#background-wrapper #sun {
-  top: -20%;
-  left: -200%;
-  right: -100%;
-  bottom: -50%;
-  --color-1: hsl(23, 100%, 50%);
-  --color-2: hsl(36.5, 100%, 50%);
-  --color-3: hsl(44.9, 100%, 50%);
-  background-image:
-    radial-gradient(
-      var(--color-1),
-      var(--color-2) 10%,
-      var(--color-3) 20%,
-      transparent 40%);
+      var(--color-2) 30%,
+      transparent 35%);
 }
 @media (prefers-color-scheme: dark) {
   #background-wrapper {
@@ -88,11 +73,6 @@ main {
     --color-1: hsl(110, 60%, 30%);
     --color-2: hsl(110, 50%, 24%);
   }
-  #background-wrapper #sun {
-    --color-1: hsl(9, 100%, 50%);
-    --color-2: hsl(36.5, 100%, 40%);
-    --color-3: hsl(44.9, 100%, 30%);
-  }
 }
 
 /* src/colors.css */

dist/index.js

@@ -2091,7 +2091,7 @@
     );
   });
   document.body.append(
-    /* @__PURE__ */ createElement("div", { id: "background-wrapper" }, /* @__PURE__ */ createElement("div", { id: "sky" }), /* @__PURE__ */ createElement("div", { id: "sun" }), /* @__PURE__ */ createElement("div", { id: "grass-1" }), /* @__PURE__ */ createElement("div", { id: "grass-2" }))
+    /* @__PURE__ */ createElement("div", { id: "background-wrapper" }, /* @__PURE__ */ createElement("div", { id: "sky" }), /* @__PURE__ */ createElement("div", { id: "grass-1" }), /* @__PURE__ */ createElement("div", { id: "grass-2" }))
   );
   document.querySelector("main").append(
     HomePage(settingsViewModel, connectionViewModel, chatListViewModel),