feat: split volume

src/app/tools/compare/page.tsx

@@ -423,13 +423,29 @@ export default function Page() {
                 }
               />
               <Row
-                name="Size"
+                name="Width"
+                value={(stats) => stats.tankSize[1]}
+                deltaType="lowerIsBetter"
+                display={(stats) => stats.tankSize[1].toFixed(1)}
+              />
+              <Row
+                name="Height"
+                value={(stats) => stats.tankSize[0]}
+                deltaType="lowerIsBetter"
+                display={(stats) => stats.tankSize[0].toFixed(1)}
+              />
+              <Row
+                name="Length"
+                value={(stats) => stats.tankSize[2]}
+                deltaType="lowerIsBetter"
+                display={(stats) => stats.tankSize[2].toFixed(1)}
+              />
+              <Row
+                name="Volume"
                 value={(stats) => stats.tankSize.reduce((a, b) => a * b, 1)}
                 deltaType="lowerIsBetter"
                 display={(stats) =>
-                  stats.tankSize
+                  stats.tankSize.reduce((a, b) => a * b, 1).toFixed(1)
-                    .map((tankSize) => tankSize.toFixed(1))
-                    .join(' x ')
                 }
               />
             </Table.Body>

src/app/tools/tankopedia/[id]/components/Characteristics/index.tsx

@@ -476,8 +476,14 @@ export function Characteristics() {
         <InfoWithDelta indent name="Caught on fire" decimals={0}>
           {stats.camouflageCaughtOnFire * 100}
         </InfoWithDelta>
-        <Info name="Size" unit="m">
+        <Info name="Width" unit="m" decimals={0}>
-          {stats.tankSize.map((component) => component.toFixed(1)).join(' x ')}
+          {stats.tankSize[1]}
+        </Info>
+        <Info name="Height" unit="m" decimals={0}>
+          {stats.tankSize[0]}
+        </Info>
+        <Info name="Length" unit="m" decimals={0}>
+          {stats.tankSize[2]}
         </Info>
       </Flex>