composer applets: .applet-btn-panel behind the OK btn for contrast on the --duoUser felt — TDD
Giving New Game / New Post the --duoUser green felt made the green OK .btn-confirm hard to see. Wrap it in an .applet-btn-panel — a --priUser fill + faint --terUser border, mirroring .gate-roles-panel (_room.scss) with tighter padding so it stays snug beside the line input — so the button reads clearly against the felt. Applied in _applet-new-game.html and the shared _form.html (New Post now; room.html's composer inherits it when ported). Tests: GameboardViewTest.test_new_game_ok_button_in_applet_btn_panel (OK btn inside #id_applet_new_game .applet-btn-panel); NewPostTest.test_new_post_applet_has_ok_confirm_button extended to assert the panel wrap. The New Game OK btn stays clickable inside the panel (GatekeeperTest.test_founder_creates_room_and_sees_gatekeeper FT green). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -137,6 +137,21 @@
|
||||
}
|
||||
}
|
||||
|
||||
// Backdrop panel behind a composer applet's OK button — mirrors
|
||||
// `.gate-roles-panel` (`_room.scss`): a --priUser fill + faint --terUser
|
||||
// border so the green .btn-confirm reads against the --duoUser felt. Tighter
|
||||
// padding than the gate panel so it stays snug beside the line input.
|
||||
.applet-btn-panel {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 0.1rem solid rgba(var(--terUser), 0.25);
|
||||
border-radius: 0.5rem;
|
||||
padding: 0.4rem;
|
||||
background: rgba(var(--priUser), 1);
|
||||
}
|
||||
|
||||
// Page-level gear buttons — fixed to viewport bottom-right
|
||||
.gameboard-page,
|
||||
.dashboard-page,
|
||||
|
||||
Reference in New Issue
Block a user