timandClaude Opus 4.8
97c71cf6e1
Sizing konstanty (seat/standings/guess/totals) presunute do boardTheme.ts a farebne odlisenie tipu v PlayerCircle (nad tip = terakota). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
40 lines
1.5 KiB
TypeScript
40 lines
1.5 KiB
TypeScript
// Single source of truth for the game board's fixed pixel sizes.
|
|
//
|
|
// The board deliberately uses fixed px (not rem) so it stays pixel-precise and
|
|
// scales as one unit via `useFitScale` (desktop) — see index.css for why the
|
|
// board opts out of the global rem type lever. These constants keep those px
|
|
// values in one place instead of scattered as inline literals across the board
|
|
// components (Standings / GameTable / …).
|
|
//
|
|
// PlayerCircle derives its own font/padding as ratios of the `size` it gets, so
|
|
// its internal ratios stay local to that component; only the per-seat `size`
|
|
// inputs live here.
|
|
|
|
/** Player-circle diameter per seat, by viewport. */
|
|
export const SEAT_SIZE = {
|
|
desktop: { top: 64, side: 64, me: 70 },
|
|
mobile: { top: 52, side: 48, me: 60 },
|
|
} as const;
|
|
|
|
/** Score list (Standings) type sizes. */
|
|
export const STANDINGS_FONT = {
|
|
desktop: { head: 12, idx: 13, cell: 18, dot: 18, sigma: 18, total: 20 },
|
|
mobile: { head: 11, idx: 9, cell: 16, dot: 13, sigma: 15, total: 18 },
|
|
} as const;
|
|
|
|
/** Header / score totals row (GameTable). The value size differs between the
|
|
* compact desktop header and the mobile header. */
|
|
export const TOTALS_FONT = {
|
|
label: 12,
|
|
valueDesktop: 18,
|
|
valueMobile: 17,
|
|
} as const;
|
|
|
|
/** Guess (tip) picker buttons (GuessControls): round button diameter + label
|
|
* size, in px — kept fixed like the rest of the board (not rem Tailwind classes)
|
|
* so they don't drift with the global font-size lever. */
|
|
export const GUESS_BUTTON = {
|
|
desktop: { size: 48, font: 22 },
|
|
mobile: { size: 40, font: 18 },
|
|
} as const;
|