style(pds-popover): add more resilient width css statements

Kajabi · Jan 22, 2024 · c84813e · c84813e
1 parent 4f36da5
commit c84813e
Showing 1 changed file with 5 additions and 2 deletions.
diff --git a/libs/core/src/components/pds-popover/pds-popover.scss b/libs/core/src/components/pds-popover/pds-popover.scss
@@ -21,7 +21,7 @@ div {
   --overlay-border-radius: var(--pine-border-radius-md);
   --overlay-font-size: var(--pine-font-size-body-sm);
   --overlay-line-height: var(--pine-line-height-sm);
-  --overlay-min-width: 240px;
+  --overlay-width: 240px;
   --overlay-padding: var(--pine-spacing-xs) 12px;
 
   --arrow-pointing-down: var(--arrow-size) var(--arrow-size) 0;
@@ -37,9 +37,12 @@ div {
   display: none;
   font-size: var(--overlay-font-size);
   line-height: var(--overlay-line-height);
-  min-width: var(--overlay-min-width);
+  max-width: var(--overlay-width); 
+  min-width: var(--overlay-width);
   padding: var(--overlay-padding);
   position: absolute;
+  /* add three width variations needed due to position values */
+  width: var(--overlay-width);
 
   .pds-popover--hoisted & {
     position: fixed;