], className='row ml-5 pt-3'), ], #className='row' ), ], className='mx-auto') navbar = dbc.Navbar( [ html.A( # Use row and col to control vertical alignment of logo / brand dbc.Row( [ dbc.Col(html.Img(src=prop_LOGO, height="30px")), ], className='mr-5', ), href="/", ), navbar_children, ], id='navbar', sticky="top") footer = html.Footer([ html.Div([html.Div(['Sebastián Carmona Ángel - DS40'], className='SCA')], className='container py-4') ], style={ 'background-color': '#343a40', 'color': '#aaaaaa'
'fontSize': '16px', 'letterSpacing': '4px', 'font-weight': '400', 'padding': '12px' } navbar = dbc.Navbar(children=[ html.Div( [ dbc.NavLink("Map", style=STYLE_A_ITEM), dbc.NavLink("Traveler", style=STYLE_A_ITEM), ], className="d-flex", ), dbc.NavLink([html.I(className="bi bi-house-fill me-2 text-white")], href="https://diogenet.ucsd.edu/", style=STYLE_A_ITEM, target="blank") ], color="#ffffff", className="d-flex justify-content-between", style={ 'color': '#ffffff', 'border-bottom': '1px black solid' }, id='navbar-map') sidebar_content = [ html.H5('Dataset selection', className="mt-3 mb-3"), dcc.Dropdown(id='dataset_selection_map', options=[{ 'label': key,
), ]) layout = html.Div([ dbc.Navbar( [ dbc.Col(dbc.Row(html.A( html.B(dbc.NavbarBrand("<"), className="padding-small"), href="/join_host_game", ), justify="center"), width="auto"), dbc.Col(dbc.Row(dbc.NavbarBrand("Host a Game"), justify="center")), dbc.Col( dbc.Row( html.B( html.A( html.I(className="fa fa-user fa-lg", style={'color': 'white'}), # href="/", )), justify="center"), width="auto"), ], color="dark", dark=True, ), dbc.Row(children=[ dbc.Col(width=1), dbc.Col(children=[ html.Br(),
navbar = dbc.Navbar( dbc.Container( [ html.A([ # Use row and col to control vertical alignment of logo / brand dbc.Row( [ #dbc.Col(html.Img(src="/assets/virus.png", height="30px")), dbc.Col(dbc.NavbarBrand("Indian COVID-19 Projections",style={'font-size': '40px'})), ], #align="right", no_gutters=True, ),dbc.Row([ html.P(dcc.Link('Computational Decision Science Laboratory', href='https://sites.google.com/iit.edu/cdsl',target="_blank", style = {"color": "#ff1127",}),style = {'font-size': '20px','margin-left':"20px"} ,id='submit-val'),]), dbc.Row([ html.P(dcc.Link( 'Illinois Institute of Technology', href='https://www.iit.edu/',target="_blank", style = {"color": "#ff1127",}),style = {'font-size': '20px','margin-left':"20px"} ,id='iit'),]) ],href="/home", ), dbc.NavbarToggler(id="navbar-toggler2"), dbc.Collapse( dbc.Nav( # right align dropdown menu with ml-auto className [dropdown], className="ml-auto", navbar=True ), id="navbar-collapse2", navbar=True, ), ] ), color="dark", dark=True, className="mb-4", )
no_gutters=True, className="ml-auto flex-nowrap mt-3 mt-md-0", align="center", ) navbar = html.Div([ dbc.Navbar( [ html.A( # Use row and col to control vertical alignment of logo / brand dbc.Row( [ dbc.Col(html.Img(src=PLOTLY_LOGO, height="30px")), dbc.Col(dbc.NavbarBrand("TPYZQ", className="ml-2")), ], align="center", no_gutters=True, ), href="https://plot.ly", ), dbc.NavbarToggler(id="navbar-toggler"), dbc.Collapse(search_bar, id="navbar-collapse", navbar=True), ], color="dark", dark=True, ) ]) sidebar = html.Div( [ html.H5("Dashboard", className="display-4"), html.Hr(),
import dash_bootstrap_components as dbc import dash_html_components as html layout = dbc.Navbar( [ dbc.Col( dbc.Row(html.B(html.A( dbc.NavbarBrand("Web App"), href="/", )), justify="center")), dbc.Col( dbc.Row(html.A( dbc.NavbarBrand("Large Screen"), href="/large", ), justify="center")), ], color="dark", dark=True, )
"margin-right": "15rem", "padding": "2rem 2rem", "fontSize":"30rem" } navbar = dbc.Navbar( html.Div( # Use row and col to control vertical alignment of logo / brand dbc.Row( [ dbc.Col( dbc.NavbarBrand( html.H2("Logo or Title",style={"align":"center"}),style={"fontSize":"60px","padding-left":"10rem"})), #dbc.NavbarToggler(id="navbar-toggler"), # dbc.Collapse(sidebar,id="sidebar-collapse",navbar=True), # dbc.Collapse(button,id="button-collapse",navbar=True) ], align="center", no_gutters=True, ), ), ) content = html.Div(id="page-content")#, style=CONTENT_STYLE) app = dash.Dash(__name__,server=server,external_stylesheets=[dbc.themes.BOOTSTRAP, FA])
no_gutters=True, className="ml-auto flex-nowrap mt-3 mt-md-0", align="center", ) navbar = dbc.Navbar( [ html.A( # Use row and col to control vertical alignment of logo / brand dbc.Row( [ dbc.Col(html.Img(src=LOGO, height="30px")), dbc.Col(dbc.NavbarBrand("Navbar", className="ml-2")), ], align="center", no_gutters=True, ), href="https://hellodash.pythonanywhere.com/", ), dbc.NavbarToggler(id="navbar-toggler"), dbc.Collapse(search_bar, id="navbar-collapse", navbar=True), ], color="dark", dark=True, className="mb-4", ) controls = dbc.Card([ dcc.Slider(), dcc.Dropdown(), ], className="my-4 p-4")
dbc.DropdownMenuItem(dbc.NavLink("Control", href='/page-7')), dbc.DropdownMenuItem(dbc.NavLink("Status", href='/page-8')), dbc.DropdownMenuItem(dbc.NavLink("Location SetUp", href='/page-4'))]), dbc.DropdownMenu(nav=True,in_navbar=True,label="SMB's", children=[ dbc.DropdownMenuItem(dbc.NavLink("Table",href="/page-5")), dbc.DropdownMenuItem(dbc.NavLink("Graph", href='/page-6')), dbc.DropdownMenuItem(divider=True), dbc.DropdownMenuItem(dbc.NavLink("Read", href='/')), dbc.DropdownMenuItem(dbc.NavLink("Write", href='/'))])], nav=True,in_navbar=True,label="DashBoard",style={'color':'black'}) navbar = dbc.Navbar(html.Div( # Use row and col to control vertical alignment of logo / brand dbc.Row([dbc.Col(html.Img(src=PLOTLY_LOGO, height="50px")), dbc.Col(dbc.NavbarBrand( html.H2("DASHBOARD",style={"align":"center",'padding-right':'30rem','fontSize':'40px','align':'center','font-style': 'Georgia', 'font-weight': 'bold','color':'#610572'}))),],), ),color="#C3C489") content = html.Div(id="page-content",style=CONTENT_STYLE) card_1 = html.Div([ dbc.Button(html.A("Trackers", id="tracker-button",href="/page-1"),outline=True),html.Br(),html.Br(), dbc.Card([dbc.CardBody([html.H4("Tracker Devices", className="card-title"), dbc.Button(dbc.CardLink("R1",href="/page-2"),className="mr-1",color="warning"), dbc.Button(dbc.CardLink("R2", href="/page-2"),className="mr-1",color="warning"), dbc.Button(dbc.CardLink("B1", href="/page-2"),className="mr-1",color="warning"), dbc.Button(dbc.CardLink("B2", href="/page-2"),className="mr-1",color="warning"),html.Br(),html.Br(), dbc.Button(dbc.CardLink("C1", href="/page-2"),className="mr-1",color="warning"), dbc.Button(dbc.CardLink("C2", href="/page-2"),className="mr-1",color="warning"), dbc.Button(dbc.CardLink("E1", href="/page-2"),className="mr-1",color="warning"),
NAVBAR = dbc.Navbar([ html.A( dbc.Row([ dbc.Col(html.Img(src="assets/logo_only.png", height="40px")), dbc.Col(dbc.NavbarBrand("econuy", className="ml-2")), ]), href="/", ), dbc.NavbarToggler(id="navbar-toggler", n_clicks=0), dbc.Collapse( dbc.Row( dbc.Nav([ dbc.NavItem( dbc.NavLink("Monitor", href="/monitor/", external_link=True)), dbc.NavItem( dbc.NavLink("Interactivo", href="/interactive/", external_link=True)), dbc.NavItem(dbc.NavLink("Inicio", href="/", external_link=True)), ]), no_gutters=True, className="ml-auto flex-nowrap mt-3 mt-md-0", align="center", ), id="navbar-collapse", navbar=True, is_open=False, ), ])
def header(app): search_bar = dbc.Row( [ dbc.Col( dbc.Button("Log Out", outline=True, color="dark", style={ "border-radius": "10rem", "width": "6rem", "height": "2rem", "font-size": "0.7rem" }, id="logout-button"), width="auto", ), ], no_gutters=True, className="ml-auto flex-nowrap mt-3 mt-md-0", align="center", ) header = dbc.Navbar( [ html.A( # Use row and col to control vertical alignment of logo / brand dbc.Row([ dbc.Col(html.Img( src=app.get_asset_url("profile_default4.png"), style={ "height": "2.5rem", "padding-top": "0px" }), style={"padding-right": "2rem"}, width="auto"), dbc.Col(html.Div([ html.H1("Dr. Richard Smith", style={ "font-size": "1rem", "line-height": "0.6" }), html.H6("NPI : 0000000001", style={"font-size": "0.8rem"}), ], style={"padding-top": "0.5rem"}), width="auto"), dbc.Col(width=3), dbc.Col(html.Div([ html.H1("Area of Specialty", style={ "font-size": "0.8rem", "line-height": "0.6" }), html.H6("Cardiology", style={"font-size": "0.8rem"}), ], style={"padding-top": "0.5rem"}), width="auto"), dbc.Col(width=1), dbc.Col(html.Div([ html.H1("Organization", style={ "font-size": "0.8rem", "line-height": "0.6" }), html.H6("Demo Cardiology Physician Group", style={"font-size": "0.8rem"}), ], style={"padding-top": "0.5rem"}), width="auto"), ], align="center", no_gutters=True, style={"width": "50rem"}), ), dbc.NavbarToggler(id="navbar-toggler"), dbc.Collapse(search_bar, id="navbar-collapse", navbar=True), ], color="#fff", sticky="top", expand=True, className="sticky-top", style={ "box-shadow": "0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.05)", "padding-left": "8rem", "padding-right": "8rem", "padding-top": "1rem", "padding-bottom": "1rem" } # dark=True, ) return header
dbc.Navbar([ html.A( dbc.Row([ dbc.Col(html.Img(src=PLOTLY_LOGO, height='30px')), dbc.Col(dbc.NavbarBrand('Navbar', className='ml-2')), ], align='center', no_gutters=True), href="https://plot.ly", ), dbc.NavbarToggler(id='navbar-toggler'), dbc.Collapse( id="navbar-collapse", navbar=True, children=[ dbc.Row( [ dbc.Col(dbc.Input(type="search", placeholder="Search")), dbc.Col( dbc.Button( "Search", color="primary", className="ml-2"), width="auto", ), ], no_gutters=True, className="ml-auto flex-nowrap mt-3 mt-md-0", align="center", ) ]), ], color='dark', dark=True)
navbar = dbc.Navbar( [ html.A( # Use row and col to control vertical alignment of logo / brand dbc.Row( [ dbc.Col(html.Img(src=os.path.join(os.getcwd(), '/assets/logo.png'), height="30px")), dbc.Col(dbc.NavbarBrand("CountingChickens", className="ml-2")), ], align="center", no_gutters=True, ), href="/", ), dbc.NavbarToggler(id="navbar-toggler"), dbc.Collapse( [dbc.DropdownMenu( children= [dbc.DropdownMenuItem("Twitter", header=True),]+ [dbc.DropdownMenuItem(f"#{title}", href=f"/dashboards/{link}", external_link=True) for link,title in zip(links,titles)]+ [dbc.DropdownMenuItem("Sentiment", header=True),]+ [dbc.DropdownMenuItem(f"#{title}", href=f"/dashboards/{link}", external_link=True) for link,title in zip(links_st,titles_st)] , nav=True, in_navbar=True, label="Twitter", ), dbc.DropdownMenu( children= [dbc.DropdownMenuItem("News", header=True),]+ [ dbc.DropdownMenuItem(f"Macro", href=f"/dashboards/MACRO", external_link=True), dbc.DropdownMenuItem(f"Company", href=f"/dashboards/COMPANY", external_link=True), ] , nav=True, in_navbar=True, label="News", ), dbc.DropdownMenu( children= [dbc.DropdownMenuItem("Other", header=True),]+ [ dbc.DropdownMenuItem(f"UFO (CIA)", href=f"/dashboards/UFO_CIA", external_link=True), ] , nav=True, in_navbar=True, label="Other", ),] , id="navbar-collapse", navbar=True), ], color="light", dark=False, sticky='top' )
# import pages for the app from apps import home, page_table, page_results server = app.server # building the upper navigation bar dropdown = dbc.Navbar(children=[ dbc.NavItem( dbc.NavLink("About Performance", href="{}/home".format(APP_PATH), external_link=True)), dbc.NavItem(dbc.NavLink("|", active=False, disabled=True)), dbc.NavItem( dbc.NavLink("Results Tool", href="{}/page_results".format(APP_PATH), external_link=True)), dbc.NavItem(dbc.NavLink("|", active=False, disabled=True)), dbc.NavItem( dbc.NavLink("Data Table", href="{}/page_table".format(APP_PATH), external_link=True)), ], color="dark", dark=True, className="ml-1", style={'font-size': '1.5em'}) logo_bar = dbc.Container([ dbc.Row([ dbc.Col(html.A([ html.Img(src="{}/assets/IQT_Labs_Logo.png".format(APP_PATH), style={
dbc.NavLink( 'GITHUB REPO', href='https://github.com/Akashsindhu/Cmpt_732_big_data_I_final_project' )) navbar = dbc.Navbar(dbc.Container([ html.A( dbc.Row( [ dbc.Col( dbc.NavbarBrand( "CMPT 732: Programming for Big Data Lab 1 - Group ABS", className="ml-2")), ], align="center", no_gutters=True, ), href="#", ), dbc.NavbarToggler(id="navbar-toggler"), dbc.Collapse(dbc.Nav([nav_item], className='ml-auto', navbar=True), id="navbar-collapse", navbar=True), ], ), color="dark", dark=True, className='mb-5') app = dash.Dash(__name__, external_stylesheets=external_stylesheets) # GRAPH 1 # TOTAL ACCIDENT REPORTS (2016 - 2020)
'array', 'categoryarray': list(sort_by_num['school&name'])[::-1] }, ) # navbar navbar = dbc.Navbar( [ # Use row and col to control vertical alignment of logo / brand dbc.Row( [ dbc.Col(html.Img( src= 'https://images.plot.ly/logo/new-branding/plotly-logomark.png', height="30px"), width=2), dbc.Col(dbc.NavbarBrand("中国大学MOOC 爬虫数据分析"), width=3), ], align="center", no_gutters=True, ), ], color="dark", dark=True, ) # Figure 1 figure_1 = html.Div( id='vertical_bar', children=[dcc.Graph(figure=vertical_bar_fig, style={'height': 1000})], )
header_tab = dbc.Navbar( dbc.Container( [ dbc.Row( [ dbc.Col( html.A( html.Img( id="logo", src=app.get_asset_url("/images/Logo_upc.png"), height="50px", ), href="https://upc.edu", ), md="auto", ), dbc.Col( [ html.Div( [ html.H3("Cell Annotation APP"), html.P("Dysplasic Cells"), ], id="app-title", ) ], md=True, align="center", ), ], align="center", ), dbc.Row( [ dbc.Col( [ dbc.NavbarToggler(id="navbar-toggler"), dbc.Collapse( dbc.Nav( [dbc.NavItem(button_about)], className="ml-auto", navbar=True, ), id="navbar-collapse", navbar=True, ), modal_overlay, ], md=2, ), ], align="center", ), ], fluid=True, ), dark=True, color="dark", sticky="top", className="mb-5", )
box on the top left. The body variable is the overall structure which most other sections go into. This just makes it ever so slightly easier to find the right spot to add to or change without having to count too many brackets. """ NAVBAR = dbc.Navbar( children=[ html.A( # Use row and col to control vertical alignment of logo / brand dbc.Row( [ dbc.Col(html.Img(src=PLOTLY_LOGO, height="30px")), dbc.Col( dbc.NavbarBrand("Customer Complaints NLP", className="ml-2")), ], align="center", no_gutters=True, ), href="https://plot.ly", ) ], color="dark", dark=True, sticky="top", ) LEFT_COLUMN = dbc.Jumbotron([ html.H4(children="Select bank & dataset size", className="display-5"), html.Hr(className="my-2"), html.Label("Select percentage of dataset", className="lead"),
def layout(dashboards, root_path): # Set up dash-app layout with dashboard links on the header. navbar_dropdown = dbc.Nav( dbc.DropdownMenu( children=[ dbc.DropdownMenuItem("Hi!", header=True, id=USER_GREETING_ID), dbc.DropdownMenuItem(divider=True), dbc.DropdownMenuItem("Admin", href="/admin", external_link=True), dbc.DropdownMenuItem("Logout", href=url_for("security.logout"), external_link=True), ], nav=True, in_navbar=True, label="Account", right=True, toggleClassName="btn btn-navbar", ), className="ml-auto, d-flex flex-row order-2 order-lg-3", ) collapse_menu = dbc.Collapse( dbc.Nav( [ dbc.NavItem(dbc.NavLink(d.title(), href=d.path()), id=d.path()) for d in dashboards ], className="mr-auto", navbar=True, ), id="navbar-collapse", className="order-3 order-lg-2", navbar=True, ) navbar = dbc.Navbar( dbc.Container([ dbc.NavbarToggler(id="navbar-toggler"), dbc.NavbarBrand( [ dhtml.Img( src=url_for("static", filename="logo.svg"), className="brand-icon", ) ], href=root_path, ), navbar_dropdown, collapse_menu, ], ), sticky="top", expand="lg", ) content = dhtml.Div(id="page-content") page = [ # represents the URL bar, doesn't render anything dcc.Location(id="url", refresh=False), navbar, content, ] return dhtml.Div(page)
deptname = getdepartmentnames(list(deptavg.keys())) deptavgval = list(deptavg.values()) return deptname, deptavgval # all app renders navbar = dbc.Navbar( [ html.H1( dbc.Row( [ dbc.Col(dbc.NavbarBrand("Project - One", className="ml-2")), ], align="center", no_gutters=True, ), ), ], color="dark", dark=True, sticky='top', ) nav = dbc.Nav( [ dbc.Container( html.Div([ dcc.Tabs( id="tabs", value='tab-1',
align='center', justify='end') # Header bar with Links in collapsible div header = dbc.Navbar( [ html.A( dbc.Row( [ dbc.Col(html.Img(src=PLOTLY_LOGO, height='30px'), width=2), dbc.Col(dbc.NavbarBrand('UK Covid-19 Tracker'), className='pl-2'), dbc.Col( id='live-update-text' ), # Dummy div used to force data updates on polling interval ], align='center', no_gutters=True, ), href='/', ), dbc.NavbarToggler(id='navbar-toggler'), dbc.Collapse(links_bar, id='navbar-collapse', navbar=True), ], color='dark', dark=True, ) # Main content div content = html.Div(id='page-content')
# index page import dash_core_components as dcc import dash_html_components as html from dash.dependencies import Input, Output import dash_bootstrap_components as dbc from app import app, server from flask_login import logout_user, current_user from views import login, error, page1, page2, profile, user_admin navBar = dbc.Navbar(id='navBar', children=[], sticky='top', color='primary', className='navbar navbar-expand-lg navbar-dark bg-primary', ) app.layout = html.Div([ dcc.Location(id='url', refresh=False), html.Div([ navBar, html.Div(id='pageContent') ]) ], id='table-wrapper') ################################################################################ # HANDLE PAGE ROUTING - IF USER NOT LOGGED IN, ALWAYS RETURN TO LOGIN SCREEN ################################################################################
import dash_bootstrap_components as dbc pageheader = dbc.Navbar( dbc.Container([ dbc.NavbarBrand("gQuiz", href="/home"), dbc.Nav([ dbc.NavItem(dbc.NavLink(id='user-welcome', disabled=True, href="#")), dbc.NavItem(dbc.NavLink("Home", href="/home")), dbc.NavItem(dbc.NavLink("Stats", href="/stats")), dbc.NavItem(dbc.NavLink('', id='user-logout', href='/logout')), dbc.NavItem(dbc.NavLink('', id='admin-panel', href='/panel')) ]) ]), className="mb-5", )
import dash import dash_bootstrap_components as dbc import dash_core_components as dcc import dash_html_components as html from dash.dependencies import Input, Output app = dash.Dash(external_stylesheets=[dbc.themes.BOOTSTRAP]) navbar_children = [ dbc.NavItem(dbc.NavLink("Page 1", href="/page-1")), dbc.NavItem(dbc.NavLink("Page 2", href="/page-2")), ] navbar = dbc.Navbar(navbar_children, brand="Example", sticky="top") # define content for page 1 page1 = dbc.Card( [ dbc.CardTitle("Page 1 contents"), dbc.CardText("You can replace this with whatever you like"), ], body=True, ) # define content for page 2 tab1 = dbc.Card( [ dbc.CardTitle("Page 2, tab 1 contents"), dbc.CardText("You can replace this with whatever you like"), ],
navbar = dbc.Navbar( dbc.Container([ dbc.NavbarBrand( html.I(className="fas fa-home fa-1x", style={'color': '#D5F5E3'}), # html.Img( # src='data:image/png;base64,{}'.format(LOGO_IMAGE.decode()), # height="30px"), href="/research"), dbc.NavbarToggler(id="navbar-toggler1"), dbc.Nav( [ dbc.DropdownMenu([ dbc.DropdownMenuItem("Summary", href="/research"), dbc.DropdownMenuItem("Risk Profile", href="/research"), dbc.DropdownMenuItem("Outlook", href="/research"), dbc.DropdownMenuItem("Fundamentals", href="/research") ], label="Research", nav=True, in_navbar=True), dbc.NavItem(dbc.NavLink("Backtest", href="/backtest")), dbc.NavItem(dbc.NavLink("Economy", href="/research")), dbc.NavItem(dbc.NavLink("Contact", href="/research")) ], id="navbar-collapse1", navbar=True, ), ]), color='success', dark=True, sticky="top")
# The local store will take the initial data # only the first time the page is loaded # and keep it until it is cleared. dcc.Store(id="local", storage_type="local"), # Same as the local store but will lose the data # when the browser/tab closes. dcc.Store(id="session", storage_type="session"), dcc.Location(id="url", refresh=False), dbc.Navbar(children=[ dbc.NavItem(dbc.NavLink("Link", href="#")), dbc.DropdownMenu(children=[ dbc.DropdownMenuItem("Entry 1"), dbc.DropdownMenuItem("Entry 2"), dbc.DropdownMenuItem(divider=True), dbc.DropdownMenuItem("Entry 3") ], nav=True, in_navbar=True, label="Menu"), ], brand="Demo", brand_href="/", sticky="top", color="light"), html.Div(id="page-content") ]) @app.callback(Output("page-content", "children"), [Input("url", "pathname")]) def display_page(pathname): if pathname == "/": return dbc.Container(children=[
model = Model( ) # Global variable: should be reimplemented for production server # Navbar across the top of the page. Includes logo and dropdown to select model navbar = dbc.Navbar( color="primary", dark=True, children=[ dbc.Col( dbc.NavbarBrand( html.Img(src=app.get_asset_url("muse-logo.png"), height="30px"), href="/", )), dbc.Col( dcc.Dropdown( id="model-dropdown", options=[{ "label": model, "value": model } for model in MODEL_NAMES], placeholder="Select a Model", )), ], ) # Master layout for the whole dashboard. Includes the navbar and a container that holds # loading spinners and space for the inputs and graphs. app.layout = html.Div(children=[ navbar,
navbar = dbc.Navbar( [ html.A( # Use row and col to control vertical alignment of logo / brand dbc.Row( [ dbc.Col(html.Img(src=GITHUB_LOGO, height="50px")), dbc.Col(dbc.NavbarBrand("Link to GitHub repo", className="ml-2")), ], align="center", no_gutters=True, ), href="https://github.com/fmani/dash_board-stroke-prediction", ), html.A( # Use row and col to control vertical alignment of logo / brand dbc.Row( [ dbc.Col(html.Img(src=KAGGLE_LOGO, height="50px")), dbc.Col(dbc.NavbarBrand("Link to Kaggle dataset", className="ml-2")), ], align="center", no_gutters=True, ), href="https://www.kaggle.com/fedesoriano/stroke-prediction-dataset", ), html.H1( children='Stroke Risk Factors', style={ 'textAlign': 'right', 'color': 'white', 'margin-left': '300px' }), ], color='#325899', dark=True, )
navbar = dbc.Navbar( [ dbc.NavbarBrand(html.H2("NYC Taxi Dashboard")), dbc.NavbarToggler(id="navbar-toggler"), dbc.Collapse( dbc.Nav( [ dbc.NavItem( dbc.NavLink( "Description", id="description-button", active=True, href="#", className="text-white", )), dbc.NavItem( dbc.NavLink( "Dataset", href= "https://www1.nyc.gov/site/tlc/about/tlc-trip-record-data.page", className="text-white", )), dbc.NavItem( dbc.NavLink( "Repository", href= "https://github.com/sebastjancizel/nyc-taxi-dashboard", className="text-white", )), ], style={"color": "grey"}, fill=True, ), id="navbar-collapse", navbar=True, ), ], color="primary", dark=True, sticky="top", )
navbar = dbc.Navbar( dbc.Container( [ html.A( # Use row and col to control vertical alignment of logo / brand dbc.Row( [ #dbc.Col(html.Img(src="/assets/virus.png", height="30px")), dbc.Col(dbc.NavbarBrand("MIMIC Predictive Modelling", className="ml-2")), ], align="center", no_gutters=True, ), href="/home", ), dbc.NavbarToggler(id="navbar-toggler2"), dbc.Collapse( dbc.Nav( # right align dropdown menu with ml-auto className [dropdown], className="ml-auto", navbar=True ), id="navbar-collapse2", navbar=True, ), ] ), color="dark", dark=True, className="mb-4", )