From 18cc111b26c0f379936b89b79a3ba215fdad5d14 Mon Sep 17 00:00:00 2001
From: Teriuihi <teriuihi@alttd.com>
Date: Sat, 5 Apr 2025 23:01:27 +0200
Subject: [PATCH] Adjust `overlay_gradient` to accept numeric transparency
 values.

Replaced the boolean `overlay_gradient` property with a numeric input to allow for more granular control over the overlay transparency. Updated both the map component and the header logic to handle this change dynamically.
---
 frontend/src/app/header/header.component.ts | 4 ++--
 frontend/src/app/map/map.component.html     | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/src/app/header/header.component.ts b/frontend/src/app/header/header.component.ts
index 0ce75e1..f9ce576 100644
--- a/frontend/src/app/header/header.component.ts
+++ b/frontend/src/app/header/header.component.ts
@@ -10,7 +10,7 @@ export class HeaderComponent {
   @Input() current_page: string = '';
   @Input() background_image: string = '';
   @Input() height: string = '';
-  @Input() overlay_gradient: boolean = false;
+  @Input() overlay_gradient: number = 0;
 
   public active: string = '';
 
@@ -26,7 +26,7 @@ export class HeaderComponent {
 
   public getBackgroundImage() {
     if (this.overlay_gradient) {
-      return `linear-gradient(rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.65)), url(${this.background_image})`;
+      return `linear-gradient(rgba(0, 0, 0, ${this.overlay_gradient}), rgba(0, 0, 0, ${this.overlay_gradient})), url(${this.background_image})`;
     } else {
       return `url(${this.background_image})`;
     }
diff --git a/frontend/src/app/map/map.component.html b/frontend/src/app/map/map.component.html
index 8e48f45..74b9366 100644
--- a/frontend/src/app/map/map.component.html
+++ b/frontend/src/app/map/map.component.html
@@ -1,7 +1,7 @@
 <ng-container>
   <app-header [current_page]="'map'"
               [background_image]="'public/img/backgrounds/map.jpg'"
-              [overlay_gradient]="true">
+              [overlay_gradient]=0.65>
     <div class="title" header-content>
       <h1>Dynamic Server Maps</h1>
       <h2>Which server would you like to see?</h2>