Change appearance of links with plotly/dash

1
votes

I'm working with Dash to build a dashboard. Consider the following code:

def get_index():
    index = html.Div([
        dcc.Link('Page 1', href='/page-1'),
        html.Br(),
        dcc.Link('Page 2', href='/page-2')
    ], style = {'display':'inline-block','columnCount': 2})
    return index

This gives me the following output in my app:

enter image description here

Question: How do I remove the bar below the links and change the font and color?

Thanks!

1
python-3.xplotlyplotly-dash

1 Answers

3
votes

You can customize the links by adding style as a named argument, e.g.

dcc.Link('Page 1', href='/page-1', 
         style={'font-family': 'Times New Roman, Times, serif', 'font-weight': 'bold'})

The style argument is just regular CSS.

Adding external CSS to your Dash app is preferable in my opinion because you can separate code logic and layout.