From 63ecfafce71d18f7d3f498f2a24fb12bfa1a6bdf Mon Sep 17 00:00:00 2001
From: GitHub Actions Bot <github-actions[bot]@users.noreply.github.com>
Date: Tue, 8 Apr 2025 12:48:38 +0000
Subject: [PATCH 1/2] Automated update by GitHub Actions

---
 package-lock.json | 4 ++--
 package.json      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 5ac19af..0a42b02 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "silly-game-frontend",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "silly-game-frontend",
-      "version": "0.0.2",
+      "version": "0.0.3",
       "dependencies": {
         "@angular/animations": "^18.2.0",
         "@angular/common": "^18.2.0",
diff --git a/package.json b/package.json
index b8bfc51..f3d7a80 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "silly-game-frontend",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "scripts": {
     "ng": "ng",
     "start": "ng serve",

From 1b334646b4f59394dc8d67b83389345f4a4ee196 Mon Sep 17 00:00:00 2001
From: miwr <michal.wrobel@telekom.de>
Date: Tue, 8 Apr 2025 15:09:58 +0200
Subject: [PATCH 2/2] random colors are working

---
 src/app/mario/mario.component.scss |  2 +-
 src/app/mario/mario.component.ts   | 21 +++++++++++++++++----
 2 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/src/app/mario/mario.component.scss b/src/app/mario/mario.component.scss
index a33e097..1f545f3 100644
--- a/src/app/mario/mario.component.scss
+++ b/src/app/mario/mario.component.scss
@@ -6,7 +6,7 @@ body, html {
   
   canvas {
     display: block;
-    background-color: #dceaff;
+    background-color: var(--sky-color);
     background-image: url("./cloud.png");
   }
 
diff --git a/src/app/mario/mario.component.ts b/src/app/mario/mario.component.ts
index 0ade049..d41c314 100644
--- a/src/app/mario/mario.component.ts
+++ b/src/app/mario/mario.component.ts
@@ -1,4 +1,4 @@
-import { Component, HostListener, OnInit } from '@angular/core';
+import { Component, HostBinding, HostListener, OnInit } from '@angular/core';
 import { JumpService } from '../jump.service';
 import { LoggerService } from '../logger.service';
 import { FormsModule } from '@angular/forms';
@@ -14,6 +14,18 @@ import { CommonModule } from '@angular/common';
 })
 
   export class MarioComponent implements OnInit {
+
+    pick = <T>(arr: T[]) => arr[Math.floor(Math.random() * arr.length)];
+
+    characterColors = ['red', 'green', 'blue', 'orange', 'purple', '#7fb1b8', '#b00b66', 'pink', 'brown'];
+    skyColors = ['#87CEEB', '#a0d8ef', '#c0e0ff', '#b0f0ff', '#00334f', '#ff6929'];
+    groundColors = ['#654321', '#7c4f2c', '#5b3a1a', '#4a2c15', '#000000', '#32a852', '#386e46', '#657569'];
+    characterColor = 'red';
+    skyColor = '#87CEEB';
+    groundColor = this.pick(this.groundColors);
+
+    @HostBinding('style.--sky-color') skyBackground = this.pick(this.skyColors);
+
       mario = {
         x: 50,
         y: 0,
@@ -25,7 +37,7 @@ import { CommonModule } from '@angular/common';
         jumpStrength: 20,
         gravity: 0.5,
         onGround: false,
-        color: 'orange'
+        color: this.pick(this.characterColors)
       };
     
       private canvas!: HTMLCanvasElement;
@@ -69,6 +81,7 @@ import { CommonModule } from '@angular/common';
         this.mario.y = this.canvasHeight - 100;
         this.loop();
         this.logger.log('Game initialized');
+        this.logger.log(`New colors: character=${this.characterColor}, sky=${this.skyColor}, ground=${this.groundColor}`);
       }
 
       totalJumps = 0;
@@ -138,7 +151,7 @@ import { CommonModule } from '@angular/common';
         this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
     
         // Ground
-        this.ctx.fillStyle = '#044d00';
+        this.ctx.fillStyle = this.groundColor;
         this.ctx.fillRect(0, this.canvas.height - 60, this.canvas.width, 60);
     
         // Platforms
@@ -147,7 +160,7 @@ import { CommonModule } from '@angular/common';
           this.ctx.fillRect(p.x, p.y, p.width, p.height);
         }
     
-        // Mario
+        // Main Character
         this.ctx.fillStyle = this.mario.color;
         this.ctx.fillRect(this.mario.x, this.mario.y, this.mario.width, this.mario.height);