Ion-tab-button custom component for reuse

@sportjohan wrote:

Hi,
I am making a reusable component, based on ion-tab-button and I have created a new angular component with @Component.
All works well except for the styling when this is placed inside an ion-tab-bar. The reason for this is that my new components tags are placed “in-between” ion-tab-bar and ion-tab-button. The resulting HTML looks something like:

ion-tab-bar
  ion-tab-button
  my-tab-button
    ion-tab-button

instead of the normal

ion-tab-bar
  ion-tab-button
  ion-tab-button

And it brakes the layout styling.

Screenshot 2020-04-29 at 09.29.19770×1350 23.1 KB

I have tried to add styling to my component but it has not worked so far…
Any ideas or suggestions about how to get around this, if at all possible?
A small test project illustrating the issue is available here

Posts: 1

Participants: 1

Read full topic