Change design of tab panes

Hello there!

Is there a way to change the design of the tabs panes (Adding widgets — Bokeh 2.4.2 Documentation)?
I mean with a css file or something similar?

Thanks!

Hi,

Yes, sure. Just invoke a context menu on some of the tabs and press “Inspect” - you’ll see the DOM tree with all relevant classes (Bokeh classes start with “bk-”) like “bk-bs-nav-tabs” and “bk-bs-active”.

Regards,

Eugene

···

On Friday, February 2, 2018 at 4:17:30 AM UTC+7, golanu’ de la mare wrote:

Hello there!

Is there a way to change the design of the tabs panes (https://bokeh.pydata.org/en/latest/docs/user_guide/interaction/widgets.html#tab-panes)?
I mean with a css file or something similar?

Thanks!

Hi Eugene,

thanks for your reply. :slight_smile:

Do you happen to know an online example for this? I’ve been researching this for a while now and don’t seem to find anything relevant.

I would like to write my css code directly in my python code from which I am generating the bokeh-plots.
Is there a clever way of doing this?

Cheers!

···

On Friday, February 2, 2018 at 6:48:16 AM UTC+1, Eugene Pakhomov wrote:

Hi,

Yes, sure. Just invoke a context menu on some of the tabs and press “Inspect” - you’ll see the DOM tree with all relevant classes (Bokeh classes start with “bk-”) like “bk-bs-nav-tabs” and “bk-bs-active”.

Regards,

Eugene

On Friday, February 2, 2018 at 4:17:30 AM UTC+7, golanu’ de la mare wrote:

Hello there!

Is there a way to change the design of the tabs panes (https://bokeh.pydata.org/en/latest/docs/user_guide/interaction/widgets.html#tab-panes)?
I mean with a css file or something similar?

Thanks!

What plots do you generate? Static, via “bokeh serve”, with a Bokeh Server?

  • Eugene
···

On Friday, February 2, 2018 at 8:29:53 PM UTC+7, golanu’ de la mare wrote:

Hi Eugene,

thanks for your reply. :slight_smile:

Do you happen to know an online example for this? I’ve been researching this for a while now and don’t seem to find anything relevant.

I would like to write my css code directly in my python code from which I am generating the bokeh-plots.
Is there a clever way of doing this?

Cheers!

On Friday, February 2, 2018 at 6:48:16 AM UTC+1, Eugene Pakhomov wrote:

Hi,

Yes, sure. Just invoke a context menu on some of the tabs and press “Inspect” - you’ll see the DOM tree with all relevant classes (Bokeh classes start with “bk-”) like “bk-bs-nav-tabs” and “bk-bs-active”.

Regards,

Eugene

On Friday, February 2, 2018 at 4:17:30 AM UTC+7, golanu’ de la mare wrote:

Hello there!

Is there a way to change the design of the tabs panes (https://bokeh.pydata.org/en/latest/docs/user_guide/interaction/widgets.html#tab-panes)?
I mean with a css file or something similar?

Thanks!

Hi Eugene,

so this is a part of my code which I use in order to generate the bokeh-plots by running the python code:

from bokeh.plotting import figure, Figure, output_file, show, ColumnDataSource

from bokeh.models import LinearAxis, Range1d, CustomJS, ColumnDataSource, Slider, FuncTickFormatter

from bokeh.models import HoverTool

from bokeh.layouts import column, widgetbox

from bokeh.models.widgets import RangeSlider

from bokeh.layouts import column

from bokeh.models.widgets import Panel, Tabs

from bokeh.io import output_file, show

···

p_1 = figure (plot_width=1400, plot_height=650, tools=“pan, wheel_zoom, box_zoom, save, reset”, title=“Temperature”)

start_value = df_graph_1.iloc[0, 0]

end_value = df_graph_1.iloc[-1, 0]

p_1.line (df_graph_1.iloc[:, 0], df_graph_1.iloc[:, 7], line_width= 2, legend = “Temperature”, color=“#FF0000”, alpha=1, muted_color=“#FF0000”, muted_alpha=0.15)

p_1.legend.location = “top_left”

p_1.legend.click_policy=“mute”

p_1.xaxis.axis_label = “Time”

p_1.yaxis.axis_label = “Temperature [C]”

tab1 = Panel(child=p_1, title=“Temperature 1”)

p_2 = figure (plot_width=1400, plot_height=650, tools =“pan, wheel_zoom, box_zoom, save, reset”, active_scroll=‘wheel_zoom’, title=“Temperature”)

p_2.line (df_graph_2.iloc[:, 0], df_graph_2.iloc[:,5], line_width= 2, legend = “Temperature”, color=“#880015”, alpha=1, muted_color=“#880015”, muted_alpha=0.15)

p_2.legend.location = “top_left”

p_2.legend.click_policy=“mute”

p_2.xaxis.axis_label = “Uhrzeit”

p_2.yaxis.axis_label = “Temerature [C]”

tab2 = Panel(child=p_2, title=“Temperature 2”)

output_file(“Tabs.html”)

tabs = Tabs(tabs=[tab1, tab2])

show(tabs)

While python generates my HTML (“Tabs.html”) file I would like it to also generate some costum styles to control for instance de background color of the “Tabs.html” page or to change de font-size inside the tabs and so on.
Am I able to implemet this somewhere in my existing python code or do I have to develop an entire app for that with the file stucture provided in the bokeh user’s guide?

On Friday, February 2, 2018 at 2:44:39 PM UTC+1, Eugene Pakhomov wrote:

What plots do you generate? Static, via “bokeh serve”, with a Bokeh Server?

  • Eugene

On Friday, February 2, 2018 at 8:29:53 PM UTC+7, golanu’ de la mare wrote:

Hi Eugene,

thanks for your reply. :slight_smile:

Do you happen to know an online example for this? I’ve been researching this for a while now and don’t seem to find anything relevant.

I would like to write my css code directly in my python code from which I am generating the bokeh-plots.
Is there a clever way of doing this?

Cheers!

On Friday, February 2, 2018 at 6:48:16 AM UTC+1, Eugene Pakhomov wrote:

Hi,

Yes, sure. Just invoke a context menu on some of the tabs and press “Inspect” - you’ll see the DOM tree with all relevant classes (Bokeh classes start with “bk-”) like “bk-bs-nav-tabs” and “bk-bs-active”.

Regards,

Eugene

On Friday, February 2, 2018 at 4:17:30 AM UTC+7, golanu’ de la mare wrote:

Hello there!

Is there a way to change the design of the tabs panes (https://bokeh.pydata.org/en/latest/docs/user_guide/interaction/widgets.html#tab-panes)?
I mean with a css file or something similar?

Thanks!

Hi,

I simplified your code a bit. Here’s an example of how to style the tab bar:

from bokeh.io import output_file, show
from bokeh.io.state import curstate
from bokeh.models.widgets import Panel, Tabs
from bokeh.plotting import figure
from bokeh.resources import Resources

p_1 = figure()
p_1.line([1, 2, 3], [3, 2, 1])

p_2 = figure()
p_2.line([-1, -1, -1], [1, 2, 3])

class MyResources(Resources):
@property
def css_raw(self):
return super().css_raw + [
“”“.bk-bs-nav {
background-color: red;
}”“”
]

output_file(“Tabs.html”)
curstate().file[‘resources’] = MyResources(mode=‘cdn’)
show(Tabs(tabs=[Panel(child=p_1, title=“Tab 1”),
Panel(child=p_2, title=“Tab 2”)]))

``

Regards,

Eugene

···

On Monday, February 5, 2018 at 7:59:22 PM UTC+7, golanu’ de la mare wrote:

Hi Eugene,

so this is a part of my code which I use in order to generate the bokeh-plots by running the python code:

from bokeh.plotting import figure, Figure, output_file, show, ColumnDataSource

from bokeh.models import LinearAxis, Range1d, CustomJS, ColumnDataSource, Slider, FuncTickFormatter

from bokeh.models import HoverTool

from bokeh.layouts import column, widgetbox

from bokeh.models.widgets import RangeSlider

from bokeh.layouts import column

from bokeh.models.widgets import Panel, Tabs

from bokeh.io import output_file, show

p_1 = figure (plot_width=1400, plot_height=650, tools=“pan, wheel_zoom, box_zoom, save, reset”, title=“Temperature”)

start_value = df_graph_1.iloc[0, 0]

end_value = df_graph_1.iloc[-1, 0]

p_1.line (df_graph_1.iloc[:, 0], df_graph_1.iloc[:, 7], line_width= 2, legend = “Temperature”, color=“#FF0000”, alpha=1, muted_color=“#FF0000”, muted_alpha=0.15)

p_1.legend.location = “top_left”

p_1.legend.click_policy=“mute”

p_1.xaxis.axis_label = “Time”

p_1.yaxis.axis_label = “Temperature [C]”

tab1 = Panel(child=p_1, title=“Temperature 1”)

p_2 = figure (plot_width=1400, plot_height=650, tools =“pan, wheel_zoom, box_zoom, save, reset”, active_scroll=‘wheel_zoom’, title=“Temperature”)

p_2.line (df_graph_2.iloc[:, 0], df_graph_2.iloc[:,5], line_width= 2, legend = “Temperature”, color=“#880015”, alpha=1, muted_color=“#880015”, muted_alpha=0.15)

p_2.legend.location = “top_left”

p_2.legend.click_policy=“mute”

p_2.xaxis.axis_label = “Uhrzeit”

p_2.yaxis.axis_label = “Temerature [C]”

tab2 = Panel(child=p_2, title=“Temperature 2”)

output_file(“Tabs.html”)

tabs = Tabs(tabs=[tab1, tab2])

show(tabs)

While python generates my HTML (“Tabs.html”) file I would like it to also generate some costum styles to control for instance de background color of the “Tabs.html” page or to change de font-size inside the tabs and so on.
Am I able to implemet this somewhere in my existing python code or do I have to develop an entire app for that with the file stucture provided in the bokeh user’s guide?

On Friday, February 2, 2018 at 2:44:39 PM UTC+1, Eugene Pakhomov wrote:

What plots do you generate? Static, via “bokeh serve”, with a Bokeh Server?

  • Eugene

On Friday, February 2, 2018 at 8:29:53 PM UTC+7, golanu’ de la mare wrote:

Hi Eugene,

thanks for your reply. :slight_smile:

Do you happen to know an online example for this? I’ve been researching this for a while now and don’t seem to find anything relevant.

I would like to write my css code directly in my python code from which I am generating the bokeh-plots.
Is there a clever way of doing this?

Cheers!

On Friday, February 2, 2018 at 6:48:16 AM UTC+1, Eugene Pakhomov wrote:

Hi,

Yes, sure. Just invoke a context menu on some of the tabs and press “Inspect” - you’ll see the DOM tree with all relevant classes (Bokeh classes start with “bk-”) like “bk-bs-nav-tabs” and “bk-bs-active”.

Regards,

Eugene

On Friday, February 2, 2018 at 4:17:30 AM UTC+7, golanu’ de la mare wrote:

Hello there!

Is there a way to change the design of the tabs panes (https://bokeh.pydata.org/en/latest/docs/user_guide/interaction/widgets.html#tab-panes)?
I mean with a css file or something similar?

Thanks!

Hello Eugene,

thank you very much for your fast reply and for the example.
While trying to run the code you’ve provided me, I get this error: TypeError: super() takes at least 1 argument (0 given) .
Not having much experience with the code you’ve provided me with, I would gladly appreciate if you could further help me in this matter.

···

On Monday, February 5, 2018 at 2:38:01 PM UTC+1, Eugene Pakhomov wrote:

Hi,

I simplified your code a bit. Here’s an example of how to style the tab bar:

from bokeh.io import output_file, show
from bokeh.io.state import curstate
from bokeh.models.widgets import Panel, Tabs
from bokeh.plotting import figure
from bokeh.resources import Resources

p_1 = figure()
p_1.line([1, 2, 3], [3, 2, 1])

p_2 = figure()
p_2.line([-1, -1, -1], [1, 2, 3])

class MyResources(Resources):
@property
def css_raw(self):
return super().css_raw + [
“”“.bk-bs-nav {
background-color: red;
}”“”
]

output_file(“Tabs.html”)
curstate().file[‘resources’] = MyResources(mode=‘cdn’)
show(Tabs(tabs=[Panel(child=p_1, title=“Tab 1”),
Panel(child=p_2, title=“Tab 2”)]))

``

Regards,

Eugene

On Monday, February 5, 2018 at 7:59:22 PM UTC+7, golanu’ de la mare wrote:

Hi Eugene,

so this is a part of my code which I use in order to generate the bokeh-plots by running the python code:

from bokeh.plotting import figure, Figure, output_file, show, ColumnDataSource

from bokeh.models import LinearAxis, Range1d, CustomJS, ColumnDataSource, Slider, FuncTickFormatter

from bokeh.models import HoverTool

from bokeh.layouts import column, widgetbox

from bokeh.models.widgets import RangeSlider

from bokeh.layouts import column

from bokeh.models.widgets import Panel, Tabs

from bokeh.io import output_file, show

p_1 = figure (plot_width=1400, plot_height=650, tools=“pan, wheel_zoom, box_zoom, save, reset”, title=“Temperature”)

start_value = df_graph_1.iloc[0, 0]

end_value = df_graph_1.iloc[-1, 0]

p_1.line (df_graph_1.iloc[:, 0], df_graph_1.iloc[:, 7], line_width= 2, legend = “Temperature”, color=“#FF0000”, alpha=1, muted_color=“#FF0000”, muted_alpha=0.15)

p_1.legend.location = “top_left”

p_1.legend.click_policy=“mute”

p_1.xaxis.axis_label = “Time”

p_1.yaxis.axis_label = “Temperature [C]”

tab1 = Panel(child=p_1, title=“Temperature 1”)

p_2 = figure (plot_width=1400, plot_height=650, tools =“pan, wheel_zoom, box_zoom, save, reset”, active_scroll=‘wheel_zoom’, title=“Temperature”)

p_2.line (df_graph_2.iloc[:, 0], df_graph_2.iloc[:,5], line_width= 2, legend = “Temperature”, color=“#880015”, alpha=1, muted_color=“#880015”, muted_alpha=0.15)

p_2.legend.location = “top_left”

p_2.legend.click_policy=“mute”

p_2.xaxis.axis_label = “Uhrzeit”

p_2.yaxis.axis_label = “Temerature [C]”

tab2 = Panel(child=p_2, title=“Temperature 2”)

output_file(“Tabs.html”)

tabs = Tabs(tabs=[tab1, tab2])

show(tabs)

While python generates my HTML (“Tabs.html”) file I would like it to also generate some costum styles to control for instance de background color of the “Tabs.html” page or to change de font-size inside the tabs and so on.
Am I able to implemet this somewhere in my existing python code or do I have to develop an entire app for that with the file stucture provided in the bokeh user’s guide?

On Friday, February 2, 2018 at 2:44:39 PM UTC+1, Eugene Pakhomov wrote:

What plots do you generate? Static, via “bokeh serve”, with a Bokeh Server?

  • Eugene

On Friday, February 2, 2018 at 8:29:53 PM UTC+7, golanu’ de la mare wrote:

Hi Eugene,

thanks for your reply. :slight_smile:

Do you happen to know an online example for this? I’ve been researching this for a while now and don’t seem to find anything relevant.

I would like to write my css code directly in my python code from which I am generating the bokeh-plots.
Is there a clever way of doing this?

Cheers!

On Friday, February 2, 2018 at 6:48:16 AM UTC+1, Eugene Pakhomov wrote:

Hi,

Yes, sure. Just invoke a context menu on some of the tabs and press “Inspect” - you’ll see the DOM tree with all relevant classes (Bokeh classes start with “bk-”) like “bk-bs-nav-tabs” and “bk-bs-active”.

Regards,

Eugene

On Friday, February 2, 2018 at 4:17:30 AM UTC+7, golanu’ de la mare wrote:

Hello there!

Is there a way to change the design of the tabs panes (https://bokeh.pydata.org/en/latest/docs/user_guide/interaction/widgets.html#tab-panes)?
I mean with a css file or something similar?

Thanks!

Do you use Python 2? If so, replace “super()” with “super(MyResources, self)”.

  • Eugene
···

On Monday, February 5, 2018 at 9:21:40 PM UTC+7, golanu’ de la mare wrote:

Hello Eugene,

thank you very much for your fast reply and for the example.
While trying to run the code you’ve provided me, I get this error: TypeError: super() takes at least 1 argument (0 given) .
Not having much experience with the code you’ve provided me with, I would gladly appreciate if you could further help me in this matter.

On Monday, February 5, 2018 at 2:38:01 PM UTC+1, Eugene Pakhomov wrote:

Hi,

I simplified your code a bit. Here’s an example of how to style the tab bar:

from bokeh.io import output_file, show
from bokeh.io.state import curstate
from bokeh.models.widgets import Panel, Tabs
from bokeh.plotting import figure
from bokeh.resources import Resources

p_1 = figure()
p_1.line([1, 2, 3], [3, 2, 1])

p_2 = figure()
p_2.line([-1, -1, -1], [1, 2, 3])

class MyResources(Resources):
@property
def css_raw(self):
return super().css_raw + [
“”“.bk-bs-nav {
background-color: red;
}”“”
]

output_file(“Tabs.html”)
curstate().file[‘resources’] = MyResources(mode=‘cdn’)
show(Tabs(tabs=[Panel(child=p_1, title=“Tab 1”),
Panel(child=p_2, title=“Tab 2”)]))

``

Regards,

Eugene

On Monday, February 5, 2018 at 7:59:22 PM UTC+7, golanu’ de la mare wrote:

Hi Eugene,

so this is a part of my code which I use in order to generate the bokeh-plots by running the python code:

from bokeh.plotting import figure, Figure, output_file, show, ColumnDataSource

from bokeh.models import LinearAxis, Range1d, CustomJS, ColumnDataSource, Slider, FuncTickFormatter

from bokeh.models import HoverTool

from bokeh.layouts import column, widgetbox

from bokeh.models.widgets import RangeSlider

from bokeh.layouts import column

from bokeh.models.widgets import Panel, Tabs

from bokeh.io import output_file, show

p_1 = figure (plot_width=1400, plot_height=650, tools=“pan, wheel_zoom, box_zoom, save, reset”, title=“Temperature”)

start_value = df_graph_1.iloc[0, 0]

end_value = df_graph_1.iloc[-1, 0]

p_1.line (df_graph_1.iloc[:, 0], df_graph_1.iloc[:, 7], line_width= 2, legend = “Temperature”, color=“#FF0000”, alpha=1, muted_color=“#FF0000”, muted_alpha=0.15)

p_1.legend.location = “top_left”

p_1.legend.click_policy=“mute”

p_1.xaxis.axis_label = “Time”

p_1.yaxis.axis_label = “Temperature [C]”

tab1 = Panel(child=p_1, title=“Temperature 1”)

p_2 = figure (plot_width=1400, plot_height=650, tools =“pan, wheel_zoom, box_zoom, save, reset”, active_scroll=‘wheel_zoom’, title=“Temperature”)

p_2.line (df_graph_2.iloc[:, 0], df_graph_2.iloc[:,5], line_width= 2, legend = “Temperature”, color=“#880015”, alpha=1, muted_color=“#880015”, muted_alpha=0.15)

p_2.legend.location = “top_left”

p_2.legend.click_policy=“mute”

p_2.xaxis.axis_label = “Uhrzeit”

p_2.yaxis.axis_label = “Temerature [C]”

tab2 = Panel(child=p_2, title=“Temperature 2”)

output_file(“Tabs.html”)

tabs = Tabs(tabs=[tab1, tab2])

show(tabs)

While python generates my HTML (“Tabs.html”) file I would like it to also generate some costum styles to control for instance de background color of the “Tabs.html” page or to change de font-size inside the tabs and so on.
Am I able to implemet this somewhere in my existing python code or do I have to develop an entire app for that with the file stucture provided in the bokeh user’s guide?

On Friday, February 2, 2018 at 2:44:39 PM UTC+1, Eugene Pakhomov wrote:

What plots do you generate? Static, via “bokeh serve”, with a Bokeh Server?

  • Eugene

On Friday, February 2, 2018 at 8:29:53 PM UTC+7, golanu’ de la mare wrote:

Hi Eugene,

thanks for your reply. :slight_smile:

Do you happen to know an online example for this? I’ve been researching this for a while now and don’t seem to find anything relevant.

I would like to write my css code directly in my python code from which I am generating the bokeh-plots.
Is there a clever way of doing this?

Cheers!

On Friday, February 2, 2018 at 6:48:16 AM UTC+1, Eugene Pakhomov wrote:

Hi,

Yes, sure. Just invoke a context menu on some of the tabs and press “Inspect” - you’ll see the DOM tree with all relevant classes (Bokeh classes start with “bk-”) like “bk-bs-nav-tabs” and “bk-bs-active”.

Regards,

Eugene

On Friday, February 2, 2018 at 4:17:30 AM UTC+7, golanu’ de la mare wrote:

Hello there!

Is there a way to change the design of the tabs panes (https://bokeh.pydata.org/en/latest/docs/user_guide/interaction/widgets.html#tab-panes)?
I mean with a css file or something similar?

Thanks!

Yes, I’m still using python 2.7. Thanks!

···

On Monday, February 5, 2018 at 3:24:04 PM UTC+1, Eugene Pakhomov wrote:

Do you use Python 2? If so, replace “super()” with “super(MyResources, self)”.

  • Eugene

On Monday, February 5, 2018 at 9:21:40 PM UTC+7, golanu’ de la mare wrote:

Hello Eugene,

thank you very much for your fast reply and for the example.
While trying to run the code you’ve provided me, I get this error: TypeError: super() takes at least 1 argument (0 given) .
Not having much experience with the code you’ve provided me with, I would gladly appreciate if you could further help me in this matter.

On Monday, February 5, 2018 at 2:38:01 PM UTC+1, Eugene Pakhomov wrote:

Hi,

I simplified your code a bit. Here’s an example of how to style the tab bar:

from bokeh.io import output_file, show
from bokeh.io.state import curstate
from bokeh.models.widgets import Panel, Tabs
from bokeh.plotting import figure
from bokeh.resources import Resources

p_1 = figure()
p_1.line([1, 2, 3], [3, 2, 1])

p_2 = figure()
p_2.line([-1, -1, -1], [1, 2, 3])

class MyResources(Resources):
@property
def css_raw(self):
return super().css_raw + [
“”“.bk-bs-nav {
background-color: red;
}”“”
]

output_file(“Tabs.html”)
curstate().file[‘resources’] = MyResources(mode=‘cdn’)
show(Tabs(tabs=[Panel(child=p_1, title=“Tab 1”),
Panel(child=p_2, title=“Tab 2”)]))

``

Regards,

Eugene

On Monday, February 5, 2018 at 7:59:22 PM UTC+7, golanu’ de la mare wrote:

Hi Eugene,

so this is a part of my code which I use in order to generate the bokeh-plots by running the python code:

from bokeh.plotting import figure, Figure, output_file, show, ColumnDataSource

from bokeh.models import LinearAxis, Range1d, CustomJS, ColumnDataSource, Slider, FuncTickFormatter

from bokeh.models import HoverTool

from bokeh.layouts import column, widgetbox

from bokeh.models.widgets import RangeSlider

from bokeh.layouts import column

from bokeh.models.widgets import Panel, Tabs

from bokeh.io import output_file, show

p_1 = figure (plot_width=1400, plot_height=650, tools=“pan, wheel_zoom, box_zoom, save, reset”, title=“Temperature”)

start_value = df_graph_1.iloc[0, 0]

end_value = df_graph_1.iloc[-1, 0]

p_1.line (df_graph_1.iloc[:, 0], df_graph_1.iloc[:, 7], line_width= 2, legend = “Temperature”, color=“#FF0000”, alpha=1, muted_color=“#FF0000”, muted_alpha=0.15)

p_1.legend.location = “top_left”

p_1.legend.click_policy=“mute”

p_1.xaxis.axis_label = “Time”

p_1.yaxis.axis_label = “Temperature [C]”

tab1 = Panel(child=p_1, title=“Temperature 1”)

p_2 = figure (plot_width=1400, plot_height=650, tools =“pan, wheel_zoom, box_zoom, save, reset”, active_scroll=‘wheel_zoom’, title=“Temperature”)

p_2.line (df_graph_2.iloc[:, 0], df_graph_2.iloc[:,5], line_width= 2, legend = “Temperature”, color=“#880015”, alpha=1, muted_color=“#880015”, muted_alpha=0.15)

p_2.legend.location = “top_left”

p_2.legend.click_policy=“mute”

p_2.xaxis.axis_label = “Uhrzeit”

p_2.yaxis.axis_label = “Temerature [C]”

tab2 = Panel(child=p_2, title=“Temperature 2”)

output_file(“Tabs.html”)

tabs = Tabs(tabs=[tab1, tab2])

show(tabs)

While python generates my HTML (“Tabs.html”) file I would like it to also generate some costum styles to control for instance de background color of the “Tabs.html” page or to change de font-size inside the tabs and so on.
Am I able to implemet this somewhere in my existing python code or do I have to develop an entire app for that with the file stucture provided in the bokeh user’s guide?

On Friday, February 2, 2018 at 2:44:39 PM UTC+1, Eugene Pakhomov wrote:

What plots do you generate? Static, via “bokeh serve”, with a Bokeh Server?

  • Eugene

On Friday, February 2, 2018 at 8:29:53 PM UTC+7, golanu’ de la mare wrote:

Hi Eugene,

thanks for your reply. :slight_smile:

Do you happen to know an online example for this? I’ve been researching this for a while now and don’t seem to find anything relevant.

I would like to write my css code directly in my python code from which I am generating the bokeh-plots.
Is there a clever way of doing this?

Cheers!

On Friday, February 2, 2018 at 6:48:16 AM UTC+1, Eugene Pakhomov wrote:

Hi,

Yes, sure. Just invoke a context menu on some of the tabs and press “Inspect” - you’ll see the DOM tree with all relevant classes (Bokeh classes start with “bk-”) like “bk-bs-nav-tabs” and “bk-bs-active”.

Regards,

Eugene

On Friday, February 2, 2018 at 4:17:30 AM UTC+7, golanu’ de la mare wrote:

Hello there!

Is there a way to change the design of the tabs panes (https://bokeh.pydata.org/en/latest/docs/user_guide/interaction/widgets.html#tab-panes)?
I mean with a css file or something similar?

Thanks!