From 8702a549ab7c0019dec16c433797cf8fe4ed692e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bruno=20Ryb=C3=A1rsky?= <bruno@brn.systems>
Date: Sat, 27 Apr 2024 12:17:20 +0200
Subject: [PATCH] Update meme voting

---
 assets/script.js | 11 +++++++----
 assets/style.css |  2 ++
 lib/meme.php     |  4 ++--
 3 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/assets/script.js b/assets/script.js
index 105cb3d..1420898 100644
--- a/assets/script.js
+++ b/assets/script.js
@@ -628,6 +628,9 @@ async function reloadMemeVotes(memeID) {
     let memeVoteCounterElement = document.getElementById(`meme_votes_counter_${memeID}`);
     let memeVoteUpvoteElement = document.getElementById(`meme_votes_upvote_${memeID}`);
     let memeVoteDownvoteElement = document.getElementById(`meme_votes_downvote_${memeID}`);
+    let memeVoteUpvoteButtonElement = document.getElementById(`meme_votes_upvote_button_${memeID}`);
+    let memeVoteDownvoteButtonElement = document.getElementById(`meme_votes_downvote_button_${memeID}`);
+
 
     let memeVoteResponse = await doAction('/meme', {
         action: "getMemeVotes",
@@ -649,17 +652,17 @@ async function reloadMemeVotes(memeID) {
         memeVoteCounterElement.classList.add("neutral");
     }
 
-    memeVoteUpvoteElement.classList.remove('visual_hover');
-    memeVoteDownvoteElement.classList.remove('visual_hover');
+    memeVoteUpvoteButtonElement.classList.remove('visual_hover');
+    memeVoteDownvoteButtonElement.classList.remove('visual_hover');
     if (userVote > 0) {
         memeUpvoteVariant = "fill";
         memeDownvoteVariant = "line";
-        memeVoteUpvoteElement.classList.add('visual_hover');
+        memeVoteUpvoteButtonElement.classList.add('visual_hover');
     }
     else if (userVote < 0) {
         memeUpvoteVariant = "line";
         memeDownvoteVariant = "fill";
-        memeVoteDownvoteElement.classList.add('visual_hover');
+        memeVoteDownvoteButtonElement.classList.add('visual_hover');
     }
     else {
         memeUpvoteVariant = "line";
diff --git a/assets/style.css b/assets/style.css
index 3d339cb..6ab1970 100644
--- a/assets/style.css
+++ b/assets/style.css
@@ -360,6 +360,8 @@ div#articleslist>article{
     display: flex;
     flex-direction: row;
     height: fit-content;
+    width: 100%;
+    justify-content: right;
 }
 
 .meme, .meme_body {
diff --git a/lib/meme.php b/lib/meme.php
index 7722086..d400c31 100644
--- a/lib/meme.php
+++ b/lib/meme.php
@@ -47,8 +47,8 @@ function renderMeme(int $id, int $authorId, string $title, string $textContent,
         $meme_upvote_active = 'line';
         $meme_vote_counter_class = 'neutral';
     }
-    $meme_upvote = isLoggedIn() ? "<button class='meme_upvote' onclick=\"voteMeme($id, 1);\"> <i id='meme_votes_upvote_$id' class=\"ri-arrow-up-circle-$meme_upvote_active\"></i></button>" : '';
-    $meme_downvote = isLoggedIn() ? "<button class='meme_downvote' onclick=\"voteMeme($id, 0);\"> <i id='meme_votes_downvote_$id' class=\"ri-arrow-down-circle-$meme_downvote_active\"></i></button>" : '';
+    $meme_upvote = isLoggedIn() ? "<button id='meme_votes_upvote_button_$id' class='meme_upvote' onclick=\"voteMeme($id, 1);\"> <i id='meme_votes_upvote_$id' class=\"ri-arrow-up-circle-$meme_upvote_active\"></i></button>" : '';
+    $meme_downvote = isLoggedIn() ? "<button id='meme_votes_downvote_button_$id' class='meme_downvote' onclick=\"voteMeme($id, 0);\"> <i id='meme_votes_downvote_$id' class=\"ri-arrow-down-circle-$meme_downvote_active\"></i></button>" : '';
 
     $meme_out = str_replace('__TEMPLATE_MEME_VOTES_NUMBER__', strval($meme_net_votes), $meme_out);
     $meme_out = str_replace('__TEMPLATE_MEME_UPVOTE__', $meme_upvote, $meme_out);