[FEATURE] Coloring of active tabs

[dinya]

Problem description

By default active tabs are marked with a bold bar above the text.

Feature description

It would be more presentable if the active tab label was colored with the appropriate color (tab_colors) or appropriate text was colored or smth else. For example, something like this

from bokeh.models import Div, TabPanel, Tabs
from bokeh.plotting import show
from bokeh.layouts import layout

level0 = [1, 2]
level1 = [1, 2, 3]
level2 = [1, 2, 3, 4]

tab_colors = ["red", "blue", "green"]

label = "Lorem ipsum" 

tabs0 = list()
for l0 in level0:
    tabs1 = list()
    for l1 in level1:
        tabs2 = list()
        for l2 in level2:
            tabs2.append(TabPanel(child=Div(text='Lorem ipsum'),
                                  title=f"{l0}.{l1}.{l2} {label} at level 2"))
        tabs1.append(TabPanel(child=Tabs(tabs=tabs2),
                              title=f"{l0}.{l1} {label} at level 1"))
    tabs0.append(TabPanel(child=Tabs(tabs=tabs1),
                          title=f"{l0} {label} at level 0"))

show(Tabs(tabs=tabs0))

Potential alternatives

None

Additional information

After https://discourse.bokeh.org/t/tabs-prettification/11335/2

[dinya]

After thinking it over, it seemed like a special case. Closed the issue.

I'll leave it here as a recipe

from bokeh.models import Div, TabPanel, Tabs
from bokeh.plotting import show
from bokeh.layouts import layout

level0 = [1, 2]
level1 = [1, 2, 3]
level2 = [1, 2, 3, 4]

label = "Lorem ipsum" 

stylesheet = """
:host(.bk-Tabs) .bk-header {{
  border-bottom: 1px solid {tabcolor};
  .bk-active {{
    color: {tabcolor};
    border-color: {tabcolor};
    background-color: lightgray;
  }}
}}
"""

tabs0 = list()
for l0 in level0:
    tabs1 = list()
    for l1 in level1:
        tabs2 = list()
        for l2 in level2:
            tabs2.append(TabPanel(child=Div(text='Lorem ipsum'),
                                  title=f"{l0}.{l1}.{l2} {label} at level 2"))
        tabs1.append(TabPanel(child=Tabs(tabs=tabs2, stylesheets=[stylesheet.format(**dict(tabcolor="green"))]),
                              title=f"{l0}.{l1} {label} at level 1"))
    tabs0.append(TabPanel(child=Tabs(tabs=tabs1, stylesheets=[stylesheet.format(**dict(tabcolor="blue"))]),
                          title=f"{l0} {label} at level 0"))

show(Tabs(tabs=tabs0, stylesheets=[stylesheet.format(**dict(tabcolor="red"))]))