chessboardjsx
chessboardjsx copied to clipboard
Not filled Rook / Queen
For what ever reason the black Rook or the black Queen sometimes loses its fill SVG property. It only happens with the black Rook or the black Queen in the 8th Line. Sometimes even both black Rooks lose their color.



Down below is the broken SVG code.
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="45" height="45"> <g style="opacity: 1; fill: none; fill-rule: evenodd; fill-opacity: 1; stroke: rgb(0, 0, 0); stroke-width: 1.5px; stroke-linecap: round; stroke-linejoin: round; stroke-miterlimit: 4; stroke-dasharray: none; stroke-opacity: 1;"> <path d="M 9,39 L 36,39 L 36,36 L 9,36 L 9,39 z " style="stroke-linecap: butt;"></path> <path d="M 12.5,32 L 14,29.5 L 31,29.5 L 32.5,32 L 12.5,32 z " style="stroke-linecap: butt;"></path> <path d="M 12,36 L 12,32 L 33,32 L 33,36 L 12,36 z " style="stroke-linecap: butt;"></path> <path d="M 14,29.5 L 14,16.5 L 31,16.5 L 31,29.5 L 14,29.5 z " style="stroke-linecap: butt; stroke-linejoin: miter;"></path> <path d="M 14,16.5 L 11,14 L 34,14 L 31,16.5 L 14,16.5 z " style="stroke-linecap: butt;"></path> <path d="M 11,14 L 11,9 L 15,9 L 15,11 L 20,11 L 20,9 L 25,9 L 25,11 L 30,11 L 30,9 L 34,9 L 34,14 L 11,14 z " style="stroke-linecap: butt;"></path> <path d="M 12,35.5 L 33,35.5 L 33,35.5" style="fill: none; stroke: rgb(255, 255, 255); stroke-width: 1px; stroke-linejoin: miter;"></path> <path d="M 13,31.5 L 32,31.5" style="fill: none; stroke: rgb(255, 255, 255); stroke-width: 1px; stroke-linejoin: miter;"></path> <path d="M 14,29.5 L 31,29.5" style="fill: none; stroke: rgb(255, 255, 255); stroke-width: 1px; stroke-linejoin: miter;"></path> <path d="M 14,16.5 L 31,16.5" style="fill: none; stroke: rgb(255, 255, 255); stroke-width: 1px; stroke-linejoin: miter;"></path> <path d="M 11,14 L 34,14" style="fill: none; stroke: rgb(255, 255, 255); stroke-width: 1px; stroke-linejoin: miter;"></path>
Can you swap out the pieces for the fix? Example with the pieces prop: https://codesandbox.io/s/21r26yw13j?from-embed=&file=/src/integrations/CustomBoard.js
pehaps pass that svg into the pieces prop for the black rook and change stroke: rgb(255, 255, 255);; to stroke: rgb(0, 0, 0);