henri/trictrac
1
1
Fork 0
Code Issues 10 Pull requests Projects 1 Releases Packages Wiki Activity Actions

feat(web client): color fields for points

Browse source
This commit is contained in:
Henri Bourcereau 2026-05-01 22:43:49 +02:00
parent 60d8e0326a
commit 2c41e68cd6
3 changed files with 37 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

30
clients/web/assets/style.css
View file

@ -1395,17 +1395,37 @@ a:hover { text-decoration: underline; }
.top-row .field { justify-content: flex-start; }
/* ── Zone alternating colours (§2b) ────────────────────────────────── */
/* ── Zone alternating colours ────────────────────────────────── */
.board-quarter .field.zone-petit:nth-child(odd),
.board-quarter .field.zone-grand:nth-child(odd) { --fc: var(--field-burgundy); }
.board-quarter .field.zone-petit:nth-child(even),
.board-quarter .field.zone-grand:nth-child(even) { --fc: var(--field-ivory); }
.board-quarter .field.zone-opponent:nth-child(odd) { --fc: #1a4f72; }
.board-quarter .field.zone-opponent:nth-child(even) { --fc: #e5eadc; }
.board-quarter .field.zone-opponent:nth-child(odd),
.board-quarter .field.zone-retour:nth-child(odd) { --fc: var(--field-burgundy); }
.board-quarter .field.zone-opponent:nth-child(even),
.board-quarter .field.zone-retour:nth-child(even) { --fc: var(--field-ivory); }
.board-quarter .field.zone-retour:nth-child(odd) { --fc: #6a2810; }
.board-quarter .field.zone-retour:nth-child(even) { --fc: #f2dfa0; }
/* ── Point indicator: first N fields reflect each player's score & bredouille */
.board-quarter .field.zone-petit.point-bredouille:nth-child(odd),
.board-quarter .field.zone-grand.point-bredouille:nth-child(odd) { --fc: #1a4f72; }
.board-quarter .field.zone-petit.point-bredouille:nth-child(even),
.board-quarter .field.zone-grand.point-bredouille:nth-child(even) { --fc: #e5eadc; }
.board-quarter .field.zone-petit.point-nobredouille:nth-child(odd),
.board-quarter .field.zone-grand.point-nobredouille:nth-child(odd) { --fc: #6a2810; }
.board-quarter .field.zone-petit.point-nobredouille:nth-child(even),
.board-quarter .field.zone-grand.point-nobredouille:nth-child(even) { --fc: #f2dfa0; }
.board-quarter .field.zone-opponent.point-bredouille:nth-child(odd),
.board-quarter .field.zone-retour.point-bredouille:nth-child(odd) { --fc: #1a4f72; }
.board-quarter .field.zone-opponent.point-bredouille:nth-child(even),
.board-quarter .field.zone-retour.point-bredouille:nth-child(even) { --fc: #e5eadc; }
.board-quarter .field.zone-opponent.point-nobredouille:nth-child(odd),
.board-quarter .field.zone-retour.point-nobredouille:nth-child(odd) { --fc: #6a2810; }
.board-quarter .field.zone-opponent.point-nobredouille:nth-child(even),
.board-quarter .field.zone-retour.point-nobredouille:nth-child(even) { --fc: #f2dfa0; }
.field.corner::after {
content: '♛';

11
clients/web/src/game/components/board.rs
View file

@ -268,6 +268,10 @@ pub fn Board(
hit_fields: Vec<u8>,
) -> impl IntoView {
let board = view_state.board;
let white_points = view_state.scores[0].points;
let white_can_bredouille = view_state.scores[0].can_bredouille;
let black_points = view_state.scores[1].points;
let black_can_bredouille = view_state.scores[1].can_bredouille;
let is_move_stage = view_state.active_mp_player == Some(player_id)
&& matches!(
view_state.turn_stage,
@ -343,6 +347,13 @@ pub fn Board(
let sel = selected_origin.get();
let mut cls = format!("field {}", field_zone_class(field_num));
let is_white_pt = field_num >= 1 && field_num <= white_points;
let is_black_pt = black_points > 0 && field_num >= 25 - black_points;
if is_white_pt {
cls.push_str(if white_can_bredouille { " point-bredouille" } else { " point-no-bredouille" });
} else if is_black_pt {
cls.push_str(if black_can_bredouille { " point-bredouille" } else { " point-no-bredouille" });
}
if is_rest_corner(field_num, is_white) {
cls.push_str(" corner");
// Pulse when the corner can be reached this turn

2
clients/web/src/game/sound.rs
View file

@ -172,7 +172,7 @@ mod inner {
(1046.5, 0.51, 0.55),
];
for (freq, offset, dur) in notes {
play_tone(ctx, freq, 0.32, dur, offset, OscillatorType::Sine);
play_tone(ctx, freq, 0.12, dur, offset, OscillatorType::Sine);
}
});
}