score colors changed

src/components/leftSidebar/index.jsx

@@ -27,7 +27,7 @@ function LeftSidebar() {
                 <img src="/man.png" width="18px" height="18px" />
                 <p className="w-[80%] text-left">{empName}</p>
                 <p className={`w-[30px] h-[30px] rounded-full flex items-center text-white justify-center 
-      ${score === 0 && score<1 ? 'bg-red-400 ' : ''}
+      ${score === 0 || score<1 ? 'bg-red-400 ' : ''}
       ${score >= 1 && score < 2 ? 'bg-red-300' : ''}
       ${score >= 2 && score < 3 ? 'bg-green-400' : ''}
       ${score >= 3 && score < 4 ? 'bg-green-500 ' : ''}

src/pages/dashboard/index.jsx

@@ -75,7 +75,7 @@ function Dashboard() {
       title: "score",
       id: "score",
       render: (value) => <span className={`w-[30px] h-[30px] rounded-full flex items-center text-white justify-center 
-      ${value === 0 && value<1 ? 'bg-red-400 ' : ''}
+      ${value === 0 || value<1 ? 'bg-red-400 ' : ''}
       ${value >= 1 && value < 2 ? 'bg-red-300' : ''}
       ${value >= 2 && value < 3 ? 'bg-green-400' : ''}
       ${value >= 3 && value < 4 ? 'bg-green-500 ' : ''}

src/pages/reports/index.jsx

@@ -140,7 +140,7 @@ function Reports() {
             </div>
             <div className="flex flex-col justify-center items-center">
               <div className={`w-[40px] h-[40px] rounded-full flex items-center text-white justify-center 
-                ${empDetails?.score ===  0 && empDetails?.score<1 ? 'bg-red-400 ' : ''}
+                ${empDetails?.score ===  0 || empDetails?.score<1 ? 'bg-red-400 ' : ''}
                 ${empDetails?.score >= 1 && empDetails?.score < 2 ? 'bg-red-300' : ''}
                 ${empDetails?.score >= 2 && empDetails?.score < 3 ? 'bg-green-400' : ''}
                 ${empDetails?.score >= 3 && empDetails?.score < 4 ? 'bg-green-500 ' : ''}