TabContainer style customization for content padding is missing

Versions:

“@ui5/webcomponents”: “^1.0.0-rc.11”, “@ui5/webcomponents-base”: “^0.28.0”, “@ui5/webcomponents-theme-base”: “^1.0.0-rc.11”,

There is no way to customize padding on Content for TabContainer content.

Check this file: https://github.com/SAP/ui5-webcomponents/blob/master/packages/main/src/themes/TabContainer.css

.ui5-tc__content {
	position: relative;
	display: flex;
	height: calc(100% - var(--_ui5_tc_header_height)); /* the header height (tabs with icons and text) */
	padding: 1rem;
	background-color: var(--sapGroup_ContentBackground);
	border-bottom: var(--_ui5_tc_content_border_bottom);
	box-sizing: border-box;
}

Expected at least one of this solutions: padding should be configurable over variable:

padding: var(--_ui5_tc_content_padding);

or please support ::part css selectors for shadow dom or provide other way to customize padding

[TeodorTaushanov]

Hi @schamane,

We already implemented TabContainer responsive padding, so depending on the width of the TabConainer the paddings might change: https://sap.github.io/ui5-webcomponents/master/playground/components/TabContainer/

Usually you shouldn’t change the paddings of the content of the TabContainer, because it should be aligned with the tabs. The only exception is when the content has its own paddings. In that case you can add negative margins to the control inside the content.

Best, Teo

[unazko]

Hello colleagues,

Could you please have a look at the proposed component enhancement. There is a need to customize the TabContainer component padding as @schamane described in details.

Best Regards, Boyan