style : UI small improvements

src/lib/engine/uciEngine.ts

@@ -129,7 +129,7 @@ export abstract class UciEngine {
       const result = await this.evaluatePosition(fen, depth);
       positions.push(result);
       setEvaluationProgress?.(
-        Math.max((fens.indexOf(fen) / fens.length) * 100 - 5, 2)
+        Math.max(((fens.indexOf(fen) + 1) / fens.length) * 100 - 2, 2)
       );
     }
 

src/sections/analysis/board/evaluationBar.tsx

@@ -43,7 +43,10 @@ export default function EvaluationBar({ height }: Props) {
       borderRadius="5px"
     >
       <Box
-        sx={{ backgroundColor: boardOrientation ? "#424242" : "white" }}
+        sx={{
+          backgroundColor: boardOrientation ? "#424242" : "white",
+          transition: "height 1s",
+        }}
         height={`${
           boardOrientation
             ? 100 - evalBar.whiteBarPercentage
@@ -67,7 +70,10 @@ export default function EvaluationBar({ height }: Props) {
       </Box>
 
       <Box
-        sx={{ backgroundColor: boardOrientation ? "white" : "#424242" }}
+        sx={{
+          backgroundColor: boardOrientation ? "white" : "#424242",
+          transition: "height 1s",
+        }}
         height={`${
           boardOrientation
             ? evalBar.whiteBarPercentage

src/sections/analysis/board/squareRenderer.tsx

@@ -44,6 +44,7 @@ const SquareRenderer = forwardRef<HTMLDivElement, CustomSquareProps>(
               right: "max(-15px, -1.8vw)",
               maxWidth: "3.6vw",
               maxHeight: "3.6vw",
+              zIndex: 100,
             }}
           />
         )}