def generate_tabs_bar(tabs):
return html.Div([
gdc.Tabs(
tabs=tabs,
value=1,
id='tabs',
vertical=True,
style={
'height': '100vh',
'textAlign': 'left',
'flex': '0 0 75px',
'backgroundColor': '#072146',
'border': 'none'
},
tabsStyle={
'backgroundColor': '#004481',
'color': 'white',
'margin': '5px',
'borderStyle': 'none'
}
),
],
id='tabs-bar',
style={
'fontFamily': 'Sans-Serif'
})
def generate_tabs(wikis, networks, selected_wikis, selected_network):
return (html.Div([
gdc.Tabs(
tabs=[
{'value': 'wikis', 'label': 'WIKIS'},
{'value': 'networks', 'label': 'NETWORKS'}
],
value='wikis',
id='side-bar-tabs',
vertical=False,
selectedTabStyle={
'backgroundColor': '#004481',
},
selectedTabClassName='side-bar-selected-tab',
style={
'width': '100%',
'textAlign': 'center',
'border': 'none',
},
tabsStyle={
'backgroundColor': '#072146',
'borderRadius': '3px',
'borderLeftStyle': 'none',
'borderRightStyle': 'none',
},
tabsClassName='side-bar-tab',
),
wikis_tab(wikis, selected_wikis),
networks_tab(networks, selected_network)
],
id='side-bar-tabs-container',
)
);
def generate_side_bar(wikis, metrics):
return html.Div(
id='side-bar',
children=[
fold_button(),
html.Div(
id='side-bar-content',
children=[
#~ html.Div(style={'backgroundColor': '#072146', 'height': '15px'}),
gdc.Tabs(
tabs=[{
'value': 'wikis',
'label': 'WIKIS'
}, {
'value': 'metrics',
'label': 'METRICS'
}],
value='wikis',
id='side-bar-tabs',
vertical=False,
selectedTabStyle={
'backgroundColor': '#004481',
},
selectedTabClassName='side-bar-selected-tab',
style={
'width': '100%',
'textAlign': 'center',
'border': 'none',
},
tabsStyle={
'width': '50%',
'height': '70px',
'borderRadius': '3px',
'backgroundColor': '#072146',
'borderLeftStyle': 'none',
'borderRightStyle': 'none',
'fontSize': '18px',
'lineHeight': '21px',
'justifyContent': 'center',
'flexDirection': 'column'
},
tabsClassName='side-bar-tab',
),
wikis_tab(wikis),
metrics_tab(metrics),
compare_button(),
selection_result_container()
])
])