better fanned hands

pkg/client/src/components/FannedHand.tsx

@@ -12,14 +12,14 @@ export default (props: { handCount: number }) => {
 						face="down"
 						width="40px"
 						style={{
-							"margin-left": "-10px",
-							"margin-right": "-10px",
-							transform: `rotate(${
-								midOffset * 0.2
-							}rad) translate(0px, ${
-								2 ** Math.abs(midOffset) * 2
-							}px)`,
-							"box-shadow": "-4px 4px 4px rgba(0, 0, 0, 0.7)",
+							"margin-left": "-12px",
+							"margin-right": "-12px",
+							transform: `translate(0px, ${Math.pow(
+								Math.abs(midOffset),
+								2
+							)}px) rotate(${midOffset * 0.12}rad)`,
+							"min-width": "40px",
+							"box-shadow": "-4px 4px 6px rgba(0, 0, 0, 0.6)",
 						}}
 					/>
 				);

pkg/client/src/components/Game.tsx

@@ -66,9 +66,7 @@ export default () => {
 							const midOffset =
 								i() + 0.5 - Object.values(view().playerHandCounts).length / 2;
 
-							ref.style = `position: absolute; display: flex; justify-content: center; top: 65%; transform: translate(${Math.abs(
-								midOffset * 0
-							)}px, 0px) rotate(${midOffset * 1}rad)`;
+							ref.style = `position: absolute; display: flex; justify-content: center; top: 65%;`;
 						}}
 					>
 						<FannedHand handCount={handCount} />