Hello Support Team,
I need some help with the CSS structure of the Tabs-Component.
I used the following CSS to fit my requierements:
.e-tab .e-tab-header .e-toolbar-item.e-active.e-ileft .e-tab-text {
text-transform: none;
font-family: Roboto;
font-weight: 350;
font-size: 17px;
color: white;
}
.e-tab .e-tab-header .e-toolbar-item.e-active.e-ileft .e-tab-text:disabled {
text-transform: none;
font-family: Roboto;
font-weight: 350;
font-size: 17px;
color: white;
}
.e-tab .e-tab-header .e-toolbar-item .e-tab-text {
text-transform: none;
font-family: Roboto;
font-weight: 350;
font-size: 17px;
color: white;
}
.e-tab .e-tab-header .e-toolbar-item.e-active.e-ileft .e-tab-text:hover {
text-transform: none;
font-family: Roboto;
font-weight: 350;
font-size: 17px;
color: white;
}
.e-tab .e-tab-header .e-indicator {
background: white;
}
But as u can see in the attached video the selected or hovered item on mobile devices gets invisible if I touch on the indicator below the Tab beside the Tab.
Could u please provide me the CSS so it works as aspected.
Thanks in advance and have a good day!
Attachment:
20210422_005908_753d8bc4.zip