Optimize parallax

src/page/background/background.html.ts

@@ -1,25 +1,23 @@
 import { html } from "../../model/misc";
 import "./background.scss";
-import { fixedSeedRandom } from "../../framework/helper";
 
 export const generate = (
   count: number,
-  probability: number,
-  width: number,
-  color: string,
-  translateZ: number
+  color?: () => string,
+  height?: () => number,
+  transform?: () => string
 ): html => `
     <section class="background">
-        ${new Array(count)
-          .fill(0, 0, count)
-          .map(_ =>
-            fixedSeedRandom() < probability
-              ? `<div style="width: ${width}px; height: ${width *
-                  (fixedSeedRandom() + 0.1) *
-                  10}px; background-color: ${color}; transform: translateZ(${translateZ}px) rotate(-20deg);"
-                ></div>`
-              : `<div class="gap"></div>`
-          )
-          .join("")}
+        ${
+          count > 0
+            ? new Array(count)
+                .fill(0, 0, count)
+                .map(
+                  _ =>
+                    `<div style="background-color: ${color()}; height: ${height()}px; transform: ${transform()}"></div>`
+                )
+                .join("")
+            : ""
+        }
     </section>
 `;