From d84d0c7fef44e9f8d562a75da24fde2c00f9f768 Mon Sep 17 00:00:00 2001
From: akastijn <akastijn@alttd.com>
Date: Fri, 24 Oct 2025 19:50:48 +0200
Subject: [PATCH] Add conditional button styling and logic to indicate vote
 availability based on last vote timestamp.

---
 frontend/src/app/pages/vote/vote.component.html |  3 ++-
 frontend/src/app/pages/vote/vote.component.scss |  8 ++++++++
 frontend/src/app/pages/vote/vote.component.ts   | 11 +++++++++++
 3 files changed, 21 insertions(+), 1 deletion(-)

diff --git a/frontend/src/app/pages/vote/vote.component.html b/frontend/src/app/pages/vote/vote.component.html
index 0326b6e..f8b53c1 100644
--- a/frontend/src/app/pages/vote/vote.component.html
+++ b/frontend/src/app/pages/vote/vote.component.html
@@ -49,7 +49,8 @@
               <a (click)="clickVote(voteSite)" (contextmenu)="clickVote(voteSite); $event.preventDefault()"
                  target="_blank" rel="noopener"
                  [href]="voteSites[voteSite]">
-                <div class="button-outer">
+                <div class=button-outer [class.not-available-button-outer]="!canVote(voteSite)"
+                     [class.available-button-outer]="canVote(voteSite)">
                   <span class="button-inner">{{ getVoteText(voteSite) }}</span>
                 </div>
               </a>
diff --git a/frontend/src/app/pages/vote/vote.component.scss b/frontend/src/app/pages/vote/vote.component.scss
index 93c54d4..80bd995 100644
--- a/frontend/src/app/pages/vote/vote.component.scss
+++ b/frontend/src/app/pages/vote/vote.component.scss
@@ -41,3 +41,11 @@
   color: black;
   text-shadow: none;
 }
+
+.available-button-outer {
+  background-color: #4caf50 !important;
+}
+
+.not-available-button-outer {
+  background-color: var(--white) !important;
+}
diff --git a/frontend/src/app/pages/vote/vote.component.ts b/frontend/src/app/pages/vote/vote.component.ts
index 5f53681..4e99beb 100644
--- a/frontend/src/app/pages/vote/vote.component.ts
+++ b/frontend/src/app/pages/vote/vote.component.ts
@@ -88,4 +88,15 @@ export class VoteComponent implements OnInit, OnDestroy {
   }
 
   protected readonly Object = Object;
+
+  canVote(voteSite: string) {
+    if (!this.voteStats) {
+      return false;
+    }
+    const now: Date = new Date();
+    return (
+      this.voteStats.allVoteInfo.some(voteInfo => voteInfo.siteName === voteSite
+        && voteInfo.lastVoteTimestamp - now.getTime() < 86400000)
+    )
+  }
 }