Workspace Switcher Patterns
Current Workspace
A static current-workspace summary shows North Studio, Team plan, Admin role, and Current workspace status.
Program
Workspace switchers should show the current context before offering another workspace. This lesson keeps the summary static and readable.
current_workspace_badge.html
Visuals: captured from real browser rendering
<section class="workspace-current" aria-labelledby="workspace-current-title">
<h2 id="workspace-current-title">Current workspace</h2>
<dl>
<div><dt>Workspace</dt><dd>North Studio</dd></div>
<div><dt>Plan</dt><dd>Team</dd></div>
<div><dt>Role</dt><dd>Admin</dd></div>
<div><dt>Status</dt><dd><span class="badge">Current workspace</span></dd></div>
</dl>
<p class="note">Static workspace summary only; no account lookup, workspace service, session switch, storage, route, API, network, script, form submit, or live workspace change runs.</p>
</section>
<style>
.workspace-current { display: grid; gap: 10px; max-width: 38rem; border: 1px solid #64748b; padding: 12px; }
.workspace-current dl { display: grid; gap: 8px; margin: 0; }
.workspace-current dl div { display: grid; grid-template-columns: 8rem 1fr; gap: 8px; }
.workspace-current dt { color: #475569; }
.workspace-current dd, .note { margin: 0; }
.badge { border-radius: 999px; background: #dcfce7; padding: 2px 8px; }
.note { color: #475569; }
</style>
Label the current workspace summary.

The section is labelled by its visible heading. Show the workspace row.

The workspace name is exact pinned data. Show the plan row.

The plan is exact pinned data. Show the role row.

The role is exact pinned data. Render the current status.

The status badge makes the active workspace visible. Check workspace honesty.

Workspace, plan, role, status, and no live workspace change.
static markup
The section heading names the current workspace surface.
workspace rows
Workspace, Plan, Role, and Status values are exact pinned data.
no workspace change
The lesson should not imply account lookup, workspace services, session switches, storage, routes, APIs, scripts, form submits, or live workspace changes.