diff --git a/src/elements/expansion-panel/expansion-panel-header/expansion-panel-header.scss b/src/elements/expansion-panel/expansion-panel-header/expansion-panel-header.scss
index 39b459ea00..c65021df6d 100644
--- a/src/elements/expansion-panel/expansion-panel-header/expansion-panel-header.scss
+++ b/src/elements/expansion-panel/expansion-panel-header/expansion-panel-header.scss
@@ -76,6 +76,9 @@
align-items: center;
gap: var(--sbb-expansion-panel-title-gap);
overflow: hidden;
+
+ // Align with toggle icon
+ min-height: var(--sbb-size-icon-ui-medium);
}
.sbb-expansion-panel-header__toggle-icon {
diff --git a/src/elements/expansion-panel/expansion-panel/expansion-panel.visual.spec.ts b/src/elements/expansion-panel/expansion-panel/expansion-panel.visual.spec.ts
index 9112a1b98d..8f52bd8221 100644
--- a/src/elements/expansion-panel/expansion-panel/expansion-panel.visual.spec.ts
+++ b/src/elements/expansion-panel/expansion-panel/expansion-panel.visual.spec.ts
@@ -32,9 +32,10 @@ describe(`sbb-expansion-panel`, () => {
const titleLevelCases = ['1', '4'];
const iconCases = [
- { name: 'none', icon: undefined, slotted: false },
- { name: 'prop', icon: 'arrow-right-small', slotted: false },
- { name: 'slotted', icon: 'arrow-right-small', slotted: true },
+ { name: 'none', icon: undefined, slotted: false, disabled: false },
+ { name: 'none-disabled', icon: undefined, slotted: false, disabled: true },
+ { name: 'prop', icon: 'arrow-right-small', slotted: false, disabled: false },
+ { name: 'slotted', icon: 'arrow-right-small', slotted: true, disabled: false },
];
describeViewports({ viewports: ['zero', 'medium'] }, () => {
@@ -51,7 +52,7 @@ describe(`sbb-expansion-panel`, () => {
Header
- Content
+ Content
`);
});
@@ -74,7 +75,7 @@ describe(`sbb-expansion-panel`, () => {
Header
- Content
+ Content
`);
});
@@ -97,7 +98,7 @@ describe(`sbb-expansion-panel`, () => {
Header
- Content
+ Content
`);
}),
@@ -110,11 +111,11 @@ describe(`sbb-expansion-panel`, () => {
`icon=${state.name}`,
visualDiffDefault.with(async (setup) => {
await setup.withFixture(html`
-
+
${state.slotted ? html`` : nothing} Label
- Content
+ Content
`);
}),