diff --git a/demo/e2e/screenshot.spec.ts-snapshots/radio-dark.png b/demo/e2e/screenshot.spec.ts-snapshots/radio-dark.png
index f8c1c5a..81f61c7 100644
Binary files a/demo/e2e/screenshot.spec.ts-snapshots/radio-dark.png and b/demo/e2e/screenshot.spec.ts-snapshots/radio-dark.png differ
diff --git a/demo/e2e/screenshot.spec.ts-snapshots/radio.png b/demo/e2e/screenshot.spec.ts-snapshots/radio.png
index 3c8a777..fd65a67 100644
Binary files a/demo/e2e/screenshot.spec.ts-snapshots/radio.png and b/demo/e2e/screenshot.spec.ts-snapshots/radio.png differ
diff --git a/demo/src/app/index/pages/radio/radio.page.html b/demo/src/app/index/pages/radio/radio.page.html
index 78d9195..e7f8c3f 100644
--- a/demo/src/app/index/pages/radio/radio.page.html
+++ b/demo/src/app/index/pages/radio/radio.page.html
@@ -50,4 +50,20 @@
radio
Error option B
+
+
+
+
+ System default
+
+
+
+
+ Radio Group Across Lists
+
+ Voice 1
+ Voice 2
+
+
+
diff --git a/demo/src/app/index/pages/radio/radio.page.spec.ts b/demo/src/app/index/pages/radio/radio.page.spec.ts
index 182d2c7..3aba3f0 100644
--- a/demo/src/app/index/pages/radio/radio.page.spec.ts
+++ b/demo/src/app/index/pages/radio/radio.page.spec.ts
@@ -18,4 +18,12 @@ describe('RadioPage', () => {
it('should create', () => {
expect(component).toBeTruthy();
});
+
+ it('should demonstrate one radio group across multiple inset lists', () => {
+ const radioGroup = fixture.nativeElement.querySelector('ion-radio-group:has(> ion-list)');
+
+ expect(radioGroup).not.toBeNull();
+ expect(radioGroup.querySelectorAll(':scope > ion-list')).toHaveLength(2);
+ expect(radioGroup.querySelectorAll(':scope > ion-list > ion-item-group')).toHaveLength(2);
+ });
});
diff --git a/demo/src/app/index/pages/radio/radio.page.ts b/demo/src/app/index/pages/radio/radio.page.ts
index 7d2395a..ef64730 100644
--- a/demo/src/app/index/pages/radio/radio.page.ts
+++ b/demo/src/app/index/pages/radio/radio.page.ts
@@ -10,6 +10,7 @@ import {
IonItemGroup,
IonLabel,
IonList,
+ IonListHeader,
IonRadio,
IonRadioGroup,
IonText,
@@ -34,6 +35,7 @@ import {
IonItemGroup,
IonLabel,
IonList,
+ IonListHeader,
IonText,
IonRadioGroup,
IonRadio,
diff --git a/src/styles/utils/structured-list.scss b/src/styles/utils/structured-list.scss
index cb443d8..e287125 100644
--- a/src/styles/utils/structured-list.scss
+++ b/src/styles/utils/structured-list.scss
@@ -75,7 +75,7 @@ $groups: ion-item-group, ion-reorder-group, ion-accordion-group, ion-radio-group
}
}
- :is(#{$groups}):not(:is(#{$groups}) :is(#{$groups})) {
+ > :is(#{$groups}) {
display: block;
border-radius: $group-border-radius;
overflow: hidden;