Overhaul workspace UX for denser play workflow
This commit is contained in:
@@ -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"
|
||||
|
||||
Reference in New Issue
Block a user