diff --git a/docs/tables_frontend_overhaul_implementation_plan.md b/docs/tables_frontend_overhaul_implementation_plan.md
index d5275ca..3e6ea11 100644
--- a/docs/tables_frontend_overhaul_implementation_plan.md
+++ b/docs/tables_frontend_overhaul_implementation_plan.md
@@ -58,6 +58,7 @@ It is intentionally implementation-focused:
| 2026-03-21 | P2.6 | Completed | Replaced the dead shell omnibox trigger with a live drawer-backed omnibox foundation that loads critical tables on demand, filters table search results, surfaces pinned and recent table sections from shared state, and exposes slash-command navigation for the core destinations and tooling routes. |
| 2026-03-21 | P2.7 | Completed | Added shared frontend primitives for app-bar actions, chips, segmented tabs, drawers, inspector sections, and status indicators, wired the shell omnibox trigger onto the new app-bar action primitive, and switched the new pinned-table labels in `Tables` to the shared status-chip primitive so later page work can build on reusable building blocks instead of fresh ad hoc markup. |
| 2026-03-21 | P2.8 | Completed | Added a shared `TableContextState` service on top of browser storage and the URL serializer, moved the `Tables` page off page-local table selection persistence, and switched diagnostics to the same restore/persist/build-URI flow so table context logic now lives in shared frontend state instead of being reinvented per page. |
+| 2026-03-21 | Post-P2 fix 1 | Completed | Fixed the shell omnibox drawer regression by adding explicit shell offset variables, constraining drawer/body scrolling, and giving the omnibox its own backdrop geometry so the flyout opens within the visible viewport instead of collapsing into invalid top/bottom positioning. |
### Lessons Learned
@@ -85,6 +86,7 @@ It is intentionally implementation-focused:
- The serializer alone is not the reusable boundary. The maintainable seam is a shared context-state helper that owns restore, persist, normalization, and URI-building conventions while pages keep only workflow-specific selection logic.
- Primitive extraction lands best when one or two live consumers adopt the new components immediately. That keeps the foundation honest without forcing a broad page rewrite just to validate the abstraction.
- The omnibox foundation does not need the full final interaction model to be useful. A drawer with real table search, real pinned/recent data, and a small slash-command set is enough to validate the shell surface before Phase 3 builds deeper index and inspector flows on top of it.
+- Shared overlay primitives should not depend on undeclared layout variables. If a drawer needs shell offsets, the shell must define them explicitly and overlay-specific backdrops should be adjustable instead of assuming full-screen dimming is always correct.
## Target Outcomes
diff --git a/src/RolemasterDb.App/Components/Primitives/SurfaceDrawer.razor b/src/RolemasterDb.App/Components/Primitives/SurfaceDrawer.razor
index b9d7268..a303184 100644
--- a/src/RolemasterDb.App/Components/Primitives/SurfaceDrawer.razor
+++ b/src/RolemasterDb.App/Components/Primitives/SurfaceDrawer.razor
@@ -2,7 +2,7 @@
{
@@ -61,6 +61,9 @@
[Parameter]
public string? CssClass { get; set; }
+ [Parameter]
+ public string? BackdropCssClass { get; set; }
+
private string BuildCssClass()
{
var classes = new List { "surface-drawer", $"is-{Placement.Trim().ToLowerInvariant()}" };
@@ -72,6 +75,17 @@
return string.Join(' ', classes);
}
+ private string BuildBackdropCssClass()
+ {
+ var classes = new List { "surface-drawer-backdrop" };
+ if (!string.IsNullOrWhiteSpace(BackdropCssClass))
+ {
+ classes.Add(BackdropCssClass);
+ }
+
+ return string.Join(' ', classes);
+ }
+
private Task HandleCloseAsync() =>
OnClose.InvokeAsync();
}
diff --git a/src/RolemasterDb.App/Components/Shell/AppShell.razor.css b/src/RolemasterDb.App/Components/Shell/AppShell.razor.css
index cb46234..d58916f 100644
--- a/src/RolemasterDb.App/Components/Shell/AppShell.razor.css
+++ b/src/RolemasterDb.App/Components/Shell/AppShell.razor.css
@@ -1,4 +1,6 @@
.app-shell {
+ --shell-header-height: 5.75rem;
+ --shell-mobile-nav-height: 0rem;
min-height: 100vh;
display: flex;
flex-direction: column;
@@ -200,6 +202,11 @@
}
@media (max-width: 767.98px) {
+ .app-shell {
+ --shell-header-height: 5.1rem;
+ --shell-mobile-nav-height: 5.5rem;
+ }
+
.app-shell-header {
padding: 0.65rem 0.75rem 0;
}
diff --git a/src/RolemasterDb.App/Components/Shell/ShellOmniboxTrigger.razor b/src/RolemasterDb.App/Components/Shell/ShellOmniboxTrigger.razor
index 886820a..cd03b91 100644
--- a/src/RolemasterDb.App/Components/Shell/ShellOmniboxTrigger.razor
+++ b/src/RolemasterDb.App/Components/Shell/ShellOmniboxTrigger.razor
@@ -16,6 +16,7 @@
Title="Search tables and commands"
AriaLabel="Search tables and commands"
CssClass="shell-omnibox-drawer"
+ BackdropCssClass="shell-omnibox-backdrop"
OnClose="CloseAsync">