Skip to content

Commit 7296145

Browse files
authored
feat: add no-padding theme variant to tabsheet (#7606)
1 parent cdadcb5 commit 7296145

File tree

5 files changed

+11
-0
lines changed

5 files changed

+11
-0
lines changed

dev/tabsheet.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,7 @@
6464
<section style="margin-top: 40px">
6565
<vaadin-checkbox-group label="Tabsheet theme variants" id="variant-group" theme="vertical">
6666
<vaadin-checkbox label="bordered" value="bordered"></vaadin-checkbox>
67+
<vaadin-checkbox label="no padding" value="no-padding"></vaadin-checkbox>
6768
</vaadin-checkbox-group>
6869

6970
<vaadin-radio-group label="Direction" id="direction-group" value="ltr" theme="vertical">
Loading
Loading

packages/tabsheet/test/visual/lumo/tabsheet.test.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,12 @@ describe('tabsheet', () => {
5959
element.setAttribute('theme', 'bordered');
6060
await visualDiff(div, `${dir}-bordered`);
6161
});
62+
63+
// prettier-ignore
64+
it('no-padding', async () => { // NOSONAR
65+
element.setAttribute('theme', 'no-padding');
66+
await visualDiff(div, `${dir}-no-padding`);
67+
});
6268
});
6369
});
6470
});

packages/tabsheet/theme/lumo/vaadin-tabsheet-styles.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,10 @@ const tabsheet = css`
3838
align-items: center;
3939
justify-content: center;
4040
}
41+
42+
:host([theme~='no-padding']) [part='content'] {
43+
padding: 0;
44+
}
4145
`;
4246

4347
registerStyles('vaadin-tabsheet', [tabsheet, loader], { moduleId: 'lumo-tabsheet' });

0 commit comments

Comments
 (0)