feat: improve score highlighting

src/components/posts/Post.jsx

@@ -240,8 +240,8 @@ const Post = ({
               )}
               <PostScore
                 className="ml-2"
-                score={ranking.score}
-                hasDislikes={ranking.dislikes > 0}
+                postType={type}
+                ranking={ranking}
                 rankingReadonly={!thumbsVisible}
                 supportThreshold={supportThreshold}
               />

src/components/posts/PostScore.jsx

@@ -2,27 +2,31 @@ import React from "react";
 import classNames from "classnames";
 
 const PostScore = ({
-  score,
-  hasDislikes,
+  postType,
+  ranking,
   supportThreshold,
   rankingReadonly,
   className,
 }) => {
-  const coloring = rankingReadonly
-    ? "bg-grey-125 text-grey-200"
-    : {
+  const { score, dislikes } = ranking;
+  const highlight = postType === "procedure-proposal" && !rankingReadonly;
+  const coloring = highlight
+    ? {
         "bg-red-600 text-white": score < 0,
         "bg-grey-125 text-grey-200": score === 0 && score < supportThreshold,
         "bg-yellow-400 text-grey-300":
-          score > 0 && hasDislikes && score < supportThreshold,
+          score > 0 && dislikes > 0 && score < supportThreshold,
         "bg-green-400 text-white":
-          score >= supportThreshold || (score > 0 && !hasDislikes),
-      };
+          score >= supportThreshold || (score > 0 && dislikes <= 0),
+      }
+    : "bg-grey-125 text-grey-200";
 
   let title;
 
-  if (!rankingReadonly) {
-    if (hasDislikes) {
+  if (postType === "procedure-proposal") {
+    if (rankingReadonly) {
+      title = `Návrh postupu získal podporu ${score} hlasů.`;
+    } else if (dislikes > 0) {
       if (score < supportThreshold) {
         title = `Aktuální podpora je ${score} hlasů, pro získání podpory skupiny členů chybí ještě ${
           supportThreshold - score
@@ -48,14 +52,7 @@ const PostScore = ({
       title={title}
     >
       <i className="ico--power" />
-      <span className="font-bold">
-        {!rankingReadonly && hasDislikes && (
-          <span>
-            {score} z {supportThreshold}
-          </span>
-        )}
-        {!(!rankingReadonly && hasDislikes) && score.toString()}
-      </span>
+      <span className="font-bold">{score}</span>
     </span>
   );
 };