Tab CSS doesn't inherit from parent Panel?

Community Usage questions
1

I'm curious as to why Tabs don't inherit CSS properties from their parent Panel? In this image you can see that the background colour of the panel within the tab has changed to a lovely blue, but the tab itself is stil the default dark blue:

Screenshot 2023-07-24 at 11.04.06 AM
Screenshot 2023-07-24 at 11.04.06 AM3824×2318 347 KB

I know I can edit the CSS properties of each individual tab via:

> inner > .navigation {
   /* beautiful stylings go here */
}

...but I'm working on a project at the moment with dozens of tabs (some of them nested inside other tabs) and it would be great if I didn't have to edit them all individually. When added to the parent Panel, the above CSS doesn't get inherited either. Is this intended behaviour, or perhaps I'm missing some clever way of styling all my tabs?

2

It's the intended behavior although it doesn't fit every use case, I guess something like this would do it for you (put it once in the root's css or in a theme file):

.navigation {
  background: inherit;
}
.navigation .on {
  background: rgba(255,255,255, 0.4)
}
3

Ah, thanks @jean-emmanuel - this solution works great for my use case! Thanks again for your speedy responses and great software!