fix(segment-button): ensure the indicator moves properly

brandyscarney · brandyscarney · commit ea89e5844c65 · 2024-09-26T16:55:12.000-04:00
diff --git a/core/src/components/segment-button/segment-button.ionic.scss b/core/src/components/segment-button/segment-button.ionic.scss
@@ -33,6 +33,9 @@
 
 .button-native {
   border-bottom: var(--border-width) var(--border-style) var(--border-color);
+
+  // Ensures the indicator moves correctly between segment buttons
+  z-index: 1;
 }
 
 .button-inner {
@@ -87,5 +90,6 @@
 .segment-button-indicator {
   @include globals.position(null, 0, 0, 0);
 
+  // Ensures the indicator displays correctly above the border
   z-index: 2;
 }

Original file line number	Diff line number	Diff line change
`@@ -33,6 +33,9 @@`
`33`	`33`
`34`	`34`	`.button-native {`
`35`	`35`	`border-bottom: var(--border-width) var(--border-style) var(--border-color);`
	`36`	`+`
	`37`	`+ // Ensures the indicator moves correctly between segment buttons`
	`38`	`+ z-index: 1;`
`36`	`39`	`}`
`37`	`40`
`38`	`41`	`.button-inner {`
`@@ -87,5 +90,6 @@`
`87`	`90`	`.segment-button-indicator {`
`88`	`91`	`@include globals.position(null, 0, 0, 0);`
`89`	`92`
	`93`	`+ // Ensures the indicator displays correctly above the border`
`90`	`94`	`z-index: 2;`
`91`	`95`	`}`