Merge pull request #13390 from sg00dwin/popover-PF5-alignment-bug

openshift-merge-bot[bot] · web-flow · commit 5a9abcc65b56 · 2023-12-05T17:27:04.000Z
OCPBUGS-23378: Set min-width for PF popovers that are being overridden by an inline style
diff --git a/frontend/public/style/_overrides.scss b/frontend/public/style/_overrides.scss
@@ -396,3 +396,8 @@ ul {
   color: var(--pf-global--Color--100);
   background-color: var(--pf-global--palette--black-600);
 }
+
+// PF5 Popover component applies an new inline width:auto style that overrides it's own pf-v5-c-popover min-width: var(--pf-v5-c-popover--MinWidth). So the pf-v5-c-popover container is not a consistent size and can resize when additional content is loaded which causes the alignment to be incorrect.
+.pf-v5-c-popover {
+  min-width: var(--pf-v5-c-popover--MinWidth) !important;
+}

Original file line number	Diff line number	Diff line change
`@@ -396,3 +396,8 @@ ul {`
`396`	`396`	`color: var(--pf-global--Color--100);`
`397`	`397`	`background-color: var(--pf-global--palette--black-600);`
`398`	`398`	`}`
	`399`	`+`
	`400`	`+// PF5 Popover component applies an new inline width:auto style that overrides it's own pf-v5-c-popover min-width: var(--pf-v5-c-popover--MinWidth). So the pf-v5-c-popover container is not a consistent size and can resize when additional content is loaded which causes the alignment to be incorrect.`
	`401`	`+.pf-v5-c-popover {`
	`402`	`+ min-width: var(--pf-v5-c-popover--MinWidth) !important;`
	`403`	`+}`