fix(theme): support global-header above-sidebar position (#834)

logonoff · web-flow · commit 275d8b1c0ce4 · 2025-05-27T09:07:01.000-04:00
diff --git a/workspaces/theme/.changeset/fair-ears-hang.md b/workspaces/theme/.changeset/fair-ears-hang.md
@@ -0,0 +1,5 @@
+---
+'@red-hat-developer-hub/backstage-plugin-theme': patch
+---
+
+Support above-sidebar postiion for global header
diff --git a/workspaces/theme/plugins/theme/src/utils/createComponents.ts b/workspaces/theme/plugins/theme/src/utils/createComponents.ts
@@ -693,7 +693,7 @@ export const createComponents = (themeConfig: ThemeConfig): Components => {
             backgroundColor: general.sidebarBackgroundColor,
             // Cancel out the spacing produced by the page inset border when
             // the global header is present
-            "& #global-header ~ main, & #global-header ~ [class*='MuiLinearProgress-root']":
+            "& #global-header ~ main, & #global-header ~ [class*='MuiLinearProgress-root'], & #above-main-content-header-container ~ main, & #above-main-content-header-container ~ [class*='MuiLinearProgress-root']":
               {
                 marginTop: 'calc(-1 * var(--rhdh-v1-page-inset))',
               },

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +---
 +'@red-hat-developer-hub/backstage-plugin-theme': patch
 +---
++
 +Support above-sidebar postiion for global header
Original file line number	Diff line number	Diff line change
`@@ -693,7 +693,7 @@ export const createComponents = (themeConfig: ThemeConfig): Components => {`
`693`	`693`	`backgroundColor: general.sidebarBackgroundColor,`
`694`	`694`	`// Cancel out the spacing produced by the page inset border when`
`695`	`695`	`// the global header is present`
`696`		`- "& #global-header ~ main, & #global-header ~ [class*='MuiLinearProgress-root']":`
	`696`	`+ "& #global-header ~ main, & #global-header ~ [class='MuiLinearProgress-root'], & #above-main-content-header-container ~ main, & #above-main-content-header-container ~ [class='MuiLinearProgress-root']":`
`697`	`697`	`{`
`698`	`698`	`marginTop: 'calc(-1 * var(--rhdh-v1-page-inset))',`
`699`	`699`	`},`