diff --git a/frontend/src/App.css b/frontend/src/App.css index 501b6e0..1e31c18 100644 --- a/frontend/src/App.css +++ b/frontend/src/App.css @@ -234,8 +234,8 @@ overflow-x: auto; padding-bottom: 2px; /* to avoid cutting off focus outline */ /* Ensure dropdowns are not covered by following content (e.g., tables) */ - position: relative; - z-index: 2500; + position: relative; /* creates local stacking context for toolbar controls */ + z-index: 3000; /* higher than cards/tables so dropdowns render on top */ } .header-actions .btn-group { display: flex; @@ -255,7 +255,13 @@ /* Ensure dropdowns in header-actions overlay tables/cards correctly */ .header-actions .dropdown-menu, .page-header .dropdown-menu { - z-index: 2000; + z-index: 3001; /* slightly above the toolbar itself */ +} + +/* Elevate the entire page header above content cards/tables to avoid clipping */ +.page-header { + position: relative; + z-index: 3000; } /* Responsive sizing for small screens */ diff --git a/frontend/src/components/PageHeaderActions.jsx b/frontend/src/components/PageHeaderActions.jsx index 327d213..54765a3 100644 --- a/frontend/src/components/PageHeaderActions.jsx +++ b/frontend/src/components/PageHeaderActions.jsx @@ -40,7 +40,7 @@ function PageHeaderActions({ {(onBackgroundUpdate && onOnlineUpdate) && ( <> - +