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

fix(web client): new arrow positions

Browse source
This commit is contained in:
Henri Bourcereau 2026-06-07 20:59:19 +02:00
parent 94340fe02c
commit e9206a989c
2 changed files with 8 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -2334,7 +2334,7 @@ a:hover { text-decoration: underline; }
padding: 0.28rem 0.5rem;
transition: background 0.15s;
}
.strip-active-zone.active { background: rgba(58,42,10,0.08); }
.strip-active-zone.active { background: rgba(58,42,10,0.15); }
/* Checker-style circles */
.strip-avatar {
@ -2388,12 +2388,12 @@ a:hover { text-decoration: underline; }
}
.strip-title {
font-family: var(--font-display);
font-size: 1.4rem;
font-size: 2rem;
font-weight: 600;
font-style: italic;
color: var(--ui-ink);
letter-spacing: 0.03em;
white-space: nowrap;
margin-left: 1rem;
}
/* ── Body: board + controls ──────────────────────────────────────────── */

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

@ -112,7 +112,8 @@ fn valid_origins_for(seqs: &[(CheckerMove, CheckerMove)], staged: &[(u8, u8)]) -
}
/// Pixel center of a board field in the SVG overlay coordinate space.
/// Geometry: field 60×180px, board padding 4px, gap 4px, bar 20px, center-bar 12px.
/// Geometry: field 60×180px, board padding 4px, row gap 4px, bar 5px, center-bar 12px.
/// Quarter width: 6×60 + 5×2(inter-field gap) = 370px. Board total: 761px.
/// With triangular flèches, arrows target the WIDE BASE of each triangle —
/// that is where the checker stack actually sits.
fn field_center(f: usize, is_white: bool) -> Option<(f32, f32)> {
@ -137,9 +138,9 @@ fn field_center(f: usize, is_white: bool) -> Option<(f32, f32)> {
}
};
// Left-quarter field i center x: 4(pad) + i*62 + 30(half field) = 34 + 62i
// Right-quarter: 4 + 370(quarter) + 4(gap) + 68(bar) + 4(gap) + i*62 + 30 = 480 + 62i
// Right-quarter: 4 + 370(quarter) + 4(gap) + 5(bar) + 4(gap) + i*62 + 30 = 417 + 62i
let x = if right {
480.0 + qi as f32 * 62.0
417.0 + qi as f32 * 62.0
} else {
34.0 + qi as f32 * 62.0
};
@ -716,7 +717,7 @@ pub fn Board(
</div>
// SVG overlay: arrows for hovered jan moves
<svg
width="824" height="388"
width="761" height="388"
style="position:absolute;top:0;left:0;pointer-events:none;overflow:visible"
>
{move || {