Public/Live_RC
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Split Event Manager's race-mode page into tabs

Browse Source 
The race-mode management page (participants, teams, race format,
live grid/standings, and now the schedule/print tools) had grown into
a long scroll. Grouped into four tabs - Participants & teams, Format,
Live & results, Schedule & print - matching the tab pattern already
used for Settings. Only wrapper divs were added; no section's markup
or event bindings moved. The existing step-card overview and warning
links now switch to the right tab before jumping to it, and Open Grid
switches to the Live tab so its target is actually visible. Track/
sponsor events, which never had this length problem, are unaffected.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
larssand
2026-09-11 13:47:35 +02:00
parent 85e18db0ed
commit ba4ed30b11
8 changed files with 114 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/event_manager_view.js
View File

@@ -300,6 +300,14 @@ export function renderEventManagerMarkup(context) {
</div>
</section>
<div class="manage-tabs" role="tablist">
<button type="button" class="manage-tab" data-manage-tab="setup">${t("events.manage_tab_setup")}</button>
<button type="button" class="manage-tab" data-manage-tab="format">${t("events.manage_tab_format")}</button>
<button type="button" class="manage-tab" data-manage-tab="live">${t("events.manage_tab_live")}</button>
<button type="button" class="manage-tab" data-manage-tab="schedule">${t("events.manage_tab_schedule")}</button>
</div>
<div data-manage-panel="setup">
<div class="race-stage-grid mt-16">
<section class="panel" id="manage-setup-participants">
<div class="panel-header panel-header-with-pill">
@@ -428,7 +436,9 @@ export function renderEventManagerMarkup(context) {
: ""
}
</div>
</div>
<div data-manage-panel="format">
<section class="panel mt-16" id="manage-format">
<div class="panel-header"><h3>${t("events.race_format")}</h3></div>
<div class="panel-body">
@@ -703,6 +713,9 @@ export function renderEventManagerMarkup(context) {
</div>
</section>
</div>
<div data-manage-panel="live">
<section class="panel mt-16" id="manage-live-grid">
<div class="panel-header"><h3>${t("events.grid_editor")}</h3></div>
<div class="panel-body">
@@ -754,6 +767,9 @@ export function renderEventManagerMarkup(context) {
</section>
` : ""}
</div>
<div data-manage-panel="schedule">
<section class="panel mt-16">
<div class="panel-header"><h3>${t("events.schedule_title")}</h3></div>
<div class="panel-body">
@@ -801,6 +817,7 @@ export function renderEventManagerMarkup(context) {
</div>
</div>
</section>
</div>
`
: ""
}