[EuiPageHeaderContent] Improve responsiveness (#8044)

elastic · Sep 26, 2024 · 780048c · 780048c
1 parent ebe9833
commit 780048c
Show file tree

Hide file tree

Showing 23 changed files with 469 additions and 392 deletions.
diff --git a/...ktop_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Legacy_Children_Only.png b/...ktop_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Legacy_Children_Only.png
diff --git a/...chrome_desktop_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Playground.png b/...chrome_desktop_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Playground.png
diff --git a/..._desktop_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Responsive_False.png b/..._desktop_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Responsive_False.png
diff --git a/...esktop_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Responsive_Reverse.png b/...esktop_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Responsive_Reverse.png
diff --git a/..._desktop_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Wrapping_Content.png b/..._desktop_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Wrapping_Content.png
diff --git a/...chrome_desktop_Layout_EuiPage_EuiPageHeader_EuiPageHeaderSection_Playground.png b/...chrome_desktop_Layout_EuiPage_EuiPageHeader_EuiPageHeaderSection_Playground.png
diff --git a/...erence/chrome_desktop_Layout_EuiPage_EuiPageHeader_EuiPageHeader_Playground.png b/...erence/chrome_desktop_Layout_EuiPage_EuiPageHeader_EuiPageHeader_Playground.png
diff --git a/...ges/eui/.loki/reference/chrome_desktop_Templates_EuiPageTemplate_Playground.png b/...ges/eui/.loki/reference/chrome_desktop_Templates_EuiPageTemplate_Playground.png
diff --git a/...bile_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Legacy_Children_Only.png b/...bile_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Legacy_Children_Only.png
diff --git a/.../chrome_mobile_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Playground.png b/.../chrome_mobile_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Playground.png
diff --git a/...e_mobile_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Responsive_False.png b/...e_mobile_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Responsive_False.png
diff --git a/...mobile_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Responsive_Reverse.png b/...mobile_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Responsive_Reverse.png
diff --git a/...e_mobile_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Wrapping_Content.png b/...e_mobile_Layout_EuiPage_EuiPageHeader_EuiPageHeaderContent_Wrapping_Content.png
diff --git a/.../chrome_mobile_Layout_EuiPage_EuiPageHeader_EuiPageHeaderSection_Playground.png b/.../chrome_mobile_Layout_EuiPage_EuiPageHeader_EuiPageHeaderSection_Playground.png
diff --git a/...ference/chrome_mobile_Layout_EuiPage_EuiPageHeader_EuiPageHeader_Playground.png b/...ference/chrome_mobile_Layout_EuiPage_EuiPageHeader_EuiPageHeader_Playground.png
diff --git a/...ages/eui/.loki/reference/chrome_mobile_Templates_EuiPageTemplate_Playground.png b/...ages/eui/.loki/reference/chrome_mobile_Templates_EuiPageTemplate_Playground.png
diff --git a/packages/eui/changelogs/upcoming/8044.md b/packages/eui/changelogs/upcoming/8044.md
@@ -0,0 +1,3 @@
+- Improved `EuiPageHeader`/`EuiPageTemplate.Header`'s responsive UX:
+  - `rightSideItems` are no longer pushed to the side by wide `tabs` content
+  - `rightSideItems` now wrap more responsively at smaller container widths