Alignment for ProductSwitch and ProductSwitchItem

[MetalCar]

Is your feature request related to a problem?

I want to set the alignment for ProductSwitchItems in a ProductSwitch. Currently all ProductSwitchItems are left-aligned within the ProductSwitch-Container. Unfortunately there's no way to override this behaviour.

Describe the solution you'd like

So it would be nice to set the alignment with a property alignment="left|center|right" or something else.

Describe alternatives you've considered

No response

Additional Context

No response

[Lukas742]

Thanks for reporting! I'll forward this issue to our UI5 Web Components Colleagues as the affected component is developed in their repository.

[NHristov-sap]

Hello @SAP/ui5-webcomponents-topic-p,

Please take a look of this feature request.

Best Regards,
Nikolay Hristov

[dobrinyonkov]

Hello @MetalCar,

Thanks for reporting this.
Alignment can already be achived by styling the custom element directly.
See: https://codesandbox.io/s/ui5-webcomponents-forked-p6lc7l?file=/index.html

Please try it and let us know if you face any other issues.

Kind Regards,
Dobrin

[MetalCar]

Hello @dobrinyonkov
thanks for your codesandbox link - but unfortunately this isn't what I want to do. It seems like you tricked yourself with adding at least three items in a row.

Please see my example:
https://codesandbox.io/s/ui5-webcomponents-forked-ub0y5h

I have two product-switch-items and i want to center them. As you can see in my example, they are aligned left.

[dobrinyonkov]

Hi @MetalCar with #6683 now merged you should be able to use the justify-content property on the custom element which will be inherited by the root element inside the shadow dom.

[MetalCar]

Hi @dobrinyonkov . Thank you for your quick response - i will try this on monday at work :)