Finde deine Figur: größere Chips, die immer noch zu sechst auf ein Feld passen
Die Spielfiguren auf dem Brett waren 15 Pixel groß und leicht zu verlieren. Sie sind jetzt anderthalb mal so groß — und stapeln sich entlang des Feldes, statt darüber hinauszuquellen.
Kurz gesagt
Die farbigen Punkte, die sich über das Brett bewegen, waren 15 Pixel groß. Auf einem Handy, mit fünf weiteren Spielern auf demselben Brett, kostete es echte Mühe, den eigenen zu finden — und zu wissen, wo man steht, ist das Allergrundlegendste, was ein Brettspiel von seiner Darstellung verlangt.
Sie sind jetzt 23 Pixel groß, also etwa anderthalb mal so groß, wobei der weiße Ring, der Heiligenschein des aktiven Spielers und die Hüpfanimation entsprechend mitskaliert wurden. Sonst hat sich am Brett nichts geändert: dieselben Farben, dieselben Felder, dasselbe Layout.
Für technisch Neugierige
Die Größenänderung war eine einzige Komponente: Durchmesser, Ringbreite und der Heiligenschein leiten sich alle aus einem Token ab, und der Hüpfbogen wurde entsprechend angehoben. Das kompilierte Stylesheet bestätigt, dass der alte Wert verschwunden ist und nicht bloß überschrieben wird.
Die Layoutkorrektur war die interessantere Hälfte. Die Figuren waren als waagerechte Flex-Reihe angelegt, was für eine Figur passt und für vier falsch ist: Auf den schmalen oberen und unteren Feldern — und auf der Ecke, die alle sechs fassen kann — quollen sie schlicht über den Rand, und der Flex-Fluss verdoppelte den Versatz, der sie eigentlich auffächern sollte.
// Board.tsx — absolute-centred, offset along the cell's LONG axis
const offset = (i - (count - 1) / 2) * STACK_STEP;
const style = vertical
? { transform: `translate(-50%, calc(-50% + ${offset}px))` } // top/bottom + corners
: { transform: `translate(calc(-50% + ${offset}px), -50%)` }; // left/right columnsUm es zu prüfen, brauchte es einen Browser statt eines Tests: Das Layout wurde bei den echten Feldmaßen für jede Anzahl von zwei bis sechs und für jede Feldausrichtung gerendert und auf Abschneiden geprüft. So wurde auch das ursprüngliche Überquellen gefunden — in einem Unit-Test ist es unsichtbar, weil daran nichts falsch ist, bis es gezeichnet wird.