Overhaul workspace UX for denser play workflow

This commit is contained in:
2026-02-26 11:53:36 +01:00
parent e7114d8798
commit c3aa0d4e88
10 changed files with 355 additions and 160 deletions

View File

@@ -15,36 +15,47 @@
<div class="workspace-shell">
<header class="workspace-header">
<div class="header-group brand">
<div class="header-row">
<h1>RpgRoller</h1>
<p>Tabletop utility cockpit</p>
</div>
<div class="header-group context">
@if (User is null)
{
<p><strong>Loading user...</strong></p>
<p class="header-identity"><strong>Loading user...</strong></p>
}
else
{
<p><strong>@User.DisplayName</strong> <span class="muted">(@User.Username)</span></p>
<p class="header-identity"><strong>@User.DisplayName</strong> <span class="muted">(@User.Username)</span></p>
}
<p>Campaign: <strong>@(SelectedCampaignName ?? "No campaign selected")</strong></p>
<p>Active: <strong>@(ActiveCharacterName ?? "None selected")</strong></p>
</div>
<div class="header-group controls">
<p class="connection @ConnectionStateCssClass">@ConnectionStateLabel</p>
<div class="switch-group" role="tablist" aria-label="Screen selector">
<button type="button" class="switch @(CurrentScreen == "play" ? "active" : string.Empty)"
@onclick="SwitchToPlayAsync">Play
</button>
<button type="button" class="switch @(CurrentScreen == "management" ? "active" : string.Empty)"
@onclick="SwitchToManagementAsync">Campaign Management
<p class="header-campaign">Campaign: <strong>@(SelectedCampaignName ?? "No campaign selected")</strong></p>
<div class="header-menu-wrap">
<button
id="screen-menu-button"
type="button"
class="menu-toggle"
aria-haspopup="true"
aria-expanded="@IsScreenMenuOpen"
aria-controls="screen-menu"
@onclick="ToggleScreenMenu">
<span aria-hidden="true">☰</span>
<span class="menu-toggle-label">@CurrentScreenLabel</span>
</button>
@if (IsScreenMenuOpen)
{
<div id="screen-menu" class="screen-menu" role="menu" aria-labelledby="screen-menu-button">
<button type="button"
class="menu-item @(IsPlayScreen ? "active" : string.Empty)"
role="menuitem"
@onclick="SwitchToPlayAsync">Play
</button>
<button type="button"
class="menu-item @(IsManagementScreen ? "active" : string.Empty)"
role="menuitem"
@onclick="SwitchToManagementAsync">Campaign Management
</button>
</div>
}
</div>
<div class="header-actions">
<button type="button" @onclick="ManualRefreshAsync" disabled="@IsMutating">Refresh</button>
<button type="button" class="ghost" @onclick="LogoutAsync" disabled="@IsMutating">Logout</button>
</div>
<a href="" class="logout-link" @onclick:preventDefault="true" @onclick="LogoutAsync">Logout</a>
</div>
</header>
@@ -63,8 +74,6 @@
SelectedCharacter="SelectedCharacter"
IsMutating="IsMutating"
SelectedCharacterSkills="SelectedCharacterSkills"
SelectedSkillId="SelectedSkillId"
SelectedSkill="SelectedSkill"
IsD6="IsSelectedCampaignD6"
RollVisibility="RollVisibility"
RollVisibilityChanged="OnRollVisibilityChanged"
@@ -75,11 +84,10 @@
CanEditSkill="CanEditSkill"
CanRollSkill="CanRollSkill"
CharacterSelected="SelectCharacterAsync"
SkillSelected="SelectSkill"
EditCharacterRequested="OpenEditCharacterModal"
SkillCreated="OnSkillCreatedAsync"
SkillUpdated="OnSkillUpdatedAsync"
RollRequested="RollSelectedSkillAsync"/>
RollRequested="RollSkillAsync"/>
<CampaignLogPanel
IsCampaignDataLoading="IsCampaignDataLoading"