feat(popover): add default styles for ionic theme

os-davidlourenco · os-davidlourenco · commit 572618fe8d2d · 2026-03-20T14:18:45.000Z
diff --git a/core/src/components/popover/popover.common.scss b/core/src/components/popover/popover.common.scss
diff --git a/core/src/components/popover/popover.ionic.scss b/core/src/components/popover/popover.ionic.scss
@@ -0,0 +1,21 @@
+@use "../../themes/ionic/ionic.globals.scss" as globals;
+@use "./popover.common.scss";
+
+// Material Design Popover
+// --------------------------------------------------
+
+:host {
+  --width: 250px;
+  --max-height: 90%;
+  --box-shadow: #{globals.$ion-elevation-4};
+  --backdrop-opacity: 0.3;
+}
+
+.popover-content {
+  @include globals.border-radius(globals.$ion-border-radius-400);
+  @include globals.transform-origin(start, top);
+}
+
+.popover-viewport {
+  transition-delay: 100ms;
+}
diff --git a/core/src/components/popover/popover.ios.scss b/core/src/components/popover/popover.ios.scss
@@ -1,4 +1,4 @@
-@import "./popover";
+@import "./popover.common.scss";
 @import "./popover.ios.vars";
 
 // iOS Popover
diff --git a/core/src/components/popover/popover.md.scss b/core/src/components/popover/popover.md.scss
@@ -1,4 +1,4 @@
-@import "./popover";
+@import "./popover.common.scss";
 @import "./popover.md.vars";
 
 // Material Design Popover
diff --git a/core/src/components/popover/popover.tsx b/core/src/components/popover/popover.tsx
@@ -53,7 +53,7 @@ import { configureDismissInteraction, configureKeyboardInteraction, configureTri
   styleUrls: {
     ios: 'popover.ios.scss',
     md: 'popover.md.scss',
-    ionic: 'popover.md.scss',
+    ionic: 'popover.ionic.scss',
   },
   shadow: true,
 })

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-@import "./popover";`
	`1`	`+@import "./popover.common.scss";`
`2`	`2`	`@import "./popover.ios.vars";`
`3`	`3`
`4`	`4`	`// iOS Popover`