def return_html(): return html.Div([ html.Div([ dcc.Location(id='url', refresh=False), html.Header( className="site-header", children=[ html.Nav( className= "navbar navbar-expand-md navbar-dark bg-steel", children=[ html.Div( className="container", children=[ html.Nav( className="navbar-nav", children=[ dcc.Link( 'Home', href=('/index'), refresh=True, className="nav-item nav-link"), dcc.Link( 'Database', href=('/db'), refresh=True, className="nav-item nav-link") ]) ]) ]) ]) ]), html.Div(id='Dropdowns', children=[], style=SIDEBAR_STYLE), html.Div(id='content', children=[], style=CONTENT_STYLE) ])
def Header(): return html.Div([ html.Nav( html.Div( className="nav-wrapper", children=[ html.A("Pricing Sheet", href="/", className="brand-logo hide-on-med-and-down"), html.Ul( className="right hide-on-med-and-down", children=[ html.Li(dcc.Link('OVERVIEW', href='/overview')), html.Li( dcc.Link('EXPOSURE SUMMARY', href='/exposure-summary')), html.Li(dcc.Link('EP CURVES', href='/ep-curves')) ]), html.Ul( className="hide-on-large-only", children=[ html.Li(dcc.Link('OVERVIEW', href='/overview')), html.Li( dcc.Link('EXPOSURE SUMMARY', href='/exposure-summary')), html.Li(dcc.Link('EP CURVES', href='/ep-curves')) ]), ])), ], className="navbar-container")
def render(self): self.votes_component = VotesComponent(self.app) self.comments_component = CommentsComponent(self.app) self.analytics_component = AnalyticsComponent(self.app) self.app.layout = html.Div(children=[ html.Nav( className= "navbar navbar-light bg-white topbar mb-4 static-top shadow", children=[ html.Img(src="./assets/logo-ej-mini.png"), html.Button(className='dash-icon', children=[html.I(className='fa fa-repeat')], id='app_reload', n_clicks=0), ]), html.Div(id="app", style={ "width": "90%", "margin": "auto" }, children=[ html.Div(id="app_loader", children=self._app_root( self.analytics_component, self.votes_component, self.comments_component)) ]) ])
def make_header(): """Returns a div with a header""" rv = html.Nav( className='navbar navbar-expand-md navbar-light bg-light', children=[ # Title on the left html.Span(html.A("COVID19 - dashboard", href='/', className='navbar-brand'), className='navbar-brand mr-auto w-50'), # Links on the right html.Ul( children=[ # html.Li(html.A('Bar', # href='/bar', # className='nav-link lead' # ), # className = 'nav-item'), # html.Li(html.A('Scatter', # href='/scatter', # className='nav-link lead' # ), # className = 'nav-item'), ], className='nav navbar-nav ml-auto w-100 justify-content-end'), ]) return rv
def setLayout(self, options): self.layout = html.Div([ html.Header([ html.A(html.Img(src='assets/hexa.png', id='logo')), html.H1('ANALYSIS'), dcc.Dropdown( id='dropdown-1', options=[{ 'label': i, 'value': i } for i in options], value='', ), html.Div(id='depDropdown'), html.Button('Actualiser les données', id='button-1'), ]), html.Div(id='output'), visdcc.Run_js(id='javascript-1'), html.Footer([ html.Nav([ html.Ul([ html.Li(html.Div(id='case-1')), html.Li(html.Div(id='case-2')), html.Li(html.Div(id='case-3')) ]) ]), html.Button(id='invisible_button', style={'display': 'none'}), visdcc.Run_js(id='javascript-2'), ], id='footer') ])
def make_sidebar(**kwargs): return html.Nav( id=f"sidebar", className="nav navbar-dark bg-dark flex-column align-items-start", children=[make_brand(), html.Div(id=server.config["NAVBAR_CONTAINER_ID"])], **kwargs, )
def components_tree(self): nav_bar_brand = html.A(self.brand_name, className="navbar-brand") nav_bar_sandwich_btn = html.Button(**{"data-toggle": "collapse", "data-target": "#"+self.collapse_id, "aria-controls": self.collapse_id, "aria-expanded": "false", "aria-label": "Toggle navigation", "type": "button"}, id="idShowOrHideLink", className="navbar-toggler", children=[ html.Span(className="navbar-toggler-icon") ]) nav_bar_links = html.Ul(className="navbar-nav mr-auto", children=[ html.Li(className="nav-item", children=dcc.Link(key, href=value, className="nav-link", style={"cursor":"pointer"})) for key, value in self.links.items() ]) nav_bar_collapse = html.Div(className="navbar-collapse collapse", id=self.collapse_id, children=[nav_bar_links]) nav_bar = html.Nav(className="navbar navbar-expand-md navbar-dark bg-primary", children = [nav_bar_brand, nav_bar_sandwich_btn, nav_bar_collapse, ]) return nav_bar
def build_nav_stack(stack): children = [] for site in stack: children.append( html.Li(html.A(site.name, href=site.url), className='crumb')) return html.Div( children=[html.Nav(children=html.Ol(children), className='crumbs')])
def route(app): """App Routing by Url""" app.layout = html.Div(children=[ dcc.Location(id='url', refresh=False), html.Nav(className='navbar navbar-expand-lg navbar-light bg-light', children=[ html.Div(className='container', children=[ dcc.Link('Alcemy', className='navbar-brand', href='/'), ]) ]), html.Div(className='container', children=[ html.H1( "Welcome to Dash Plot Visualization for CSV Reports!", className='text-center'), html.Div(id='page-content') ]) ]) @app.callback(dash.dependencies.Output('page-content', 'children'), [dash.dependencies.Input('url', 'pathname')]) def display_page(pathname): if pathname == '/': return main_page.layout return error_page.layout
def getHeader(app, filters=None): return html.Nav( className='navbar fixed-top navbar-light navbar-expand-lg py-0', style={ 'background-color': WHITE_ALPHA_8, 'border-bottom': '2px solid {0}'.format(BRAND) }, children=[ html. A(href='#', children=[ html.H1( className='navbar-brand my-0', children=[ html.Img( className='d-inline-block align-middle pb-1', src=app.get_asset_url('RSE-community-logo.svg'), width='40', height='40'), html.Span( className= 'd-inline-block govuk-heading-s pl-2 mt-2 mb-0', children='RSE Dashboard'), ]), ]), html.Button(className='navbar-toggler', type='button', **{ 'data-toggle': 'collapse', 'data-target': '#navbarNav', 'aria-controls': 'navbarNav', 'aria-expanded': 'false', 'aria-label': 'Toggle navigation' }, children=[html.Span(className='navbar-toggler-icon')]), html.Div( className='collapse navbar-collapse', id='navbarNav', children=[ html.Ul(className='navbar-nav mr-auto', role='navigation', children=[ html.Li( className='nav-item', children=[ html.A(className='nav-link govuk-link', href='/pipelines', children='Pipelines') ]), html.Li( className='nav-item', children=[ html.A(className='nav-link govuk-link', href='/security', children='Security') ]), ]), filters, ]), ])
def sidebar(visible_nav): SIDEBAR_STYLE["display"] = visible_nav sidebar = html.Nav( [ html.H4("Menú", className="lead navbar-brand", style={"margin-left": "2rem"}), html.Hr(), # Esto es una línea horizontal que separa lo de arriba html.Div([ dbc.Button("Inicio", id="link-hoja-main", style={"font-size": "12px"}, className="btn btn-warning m-1"), dbc.Button("Exploración", id="link-hoja-1", style={"font-size": "12px"}, className="btn btn-warning m-1"), dbc.Button("Segmentación ", id="link-hoja-2", style={"font-size": "12px"}, className="btn btn-warning m-1"), dbc.Button("Recomendaciones", id="link-hoja-3", style={"font-size": "10px"}, className="btn btn-warning m-1"), dbc.Button("Documentación", id="link-hoja-4", style={"font-size": "10px"}, className="btn btn-warning m-1"), ], ), ], style=SIDEBAR_STYLE # ,className="navbar navbar-dark bg-dark" ) return sidebar
def get_menu(): menu = html.Div( html.Nav([ html.Div([ html.A([ html.Img( src= "https://dash.plotly.com/assets/images/logo-dash.png", width="90") ], href='/', className="nav-item"), ], className='navbar-brand'), html.Div([ html.Div([ html.A(' Home ', href="/", className="navbar-item"), html.A(' Map ', href="/maps", className="navbar-item"), html.A(' Graph ', href="/graph", className="navbar-item"), html.A(' Graph (Avocado) ', href="/graph/avocado", className="navbar-item"), ], className="navbar-start") ], id="navbarBasic", className="navbar-menu") ], className='navbar is-primary is-transparent')) # html.Nav([, className='navbar-brand'], id="navbarBasic", className='navbar') return menu
def setup_layout(self): """ Initializes the layout used for displaying this component """ return html.Div([ html.Nav( html.Div( children=[ html.P('Minterface', className='logo'), html.Ul( children=[ dcc.Link('Accounts Over Time', href='/accounts-over-time', className='nav-li' ), dcc.Link('Credit Score Over Time', href='/credit-over-time', className='nav-li' ), dcc.Link('Spending Per Category Per Paycheck', href='/spending-per-category-per-paycheck-data', className='nav-li' ), ], id='nav-mobile', className='nav nav-right' ), ], className='nav-wrapper' ), className='navbar' ) ])
def make_header(): """Returns a div with a header""" rv = html.Nav( className='navbar navbar-expand-md navbar-light bg-light', children=[ # Title on the left html.Span(html.A("Strava Poster", href='/', className='navbar-brand'), className='navbar-brand mr-auto w-50'), # Links on the right html.Ul( children=[ html.Li(html.A('Bar', href='/bar', className='nav-link lead'), className='nav-item'), html.Li(html.A('Scatter', href='/scatter', className='nav-link lead'), className='nav-item'), html.Li(html.A('Blog', href='https://sladkovm.github.io/', className='nav-link lead'), className='nav-item'), html.Li(html.A(children='Velometria', href='http://velometria.com', className='nav-link lead'), className='nav-pills'), ], className='nav navbar-nav ml-auto w-100 justify-content-end'), ]) return rv
def create_footer(): return html.Nav(children=[ html.A('@hhllcks', href='https://twitter.com/hhllcks', className='nav-link text-secondary'), html.A('Blog', href='https://www.hhllcks.de/', className='nav-link text-secondary'), html.A('Report a bug or send suggestions', href='https://github.com/hhllcks/wc3stats/issues', className='nav-link text-secondary'), ], className='nav justify-content-center')
def Navbar( children=None, items=None, current_path=None, first_root_nav=True, **kwargs): items = items if items is not None else [] nav_items = [] route_prefix = server.config['ROUTES_PATHNAME_PREFIX'] for i, (path, text) in enumerate(items): href = get_url(path) # bool indicating if: on the root url and this is the first nav item is_first_root_nav = (current_path == route_prefix) and (i == 0) # active if we are on the path of this nav item, or if first_root_nav is # enabled and applies for this path is_active = (current_path == href) or (first_root_nav and is_first_root_nav) className = 'nav-item active' if is_active else 'nav-item' nav_items.append(html.Li( className=className, children=dcc.Link(text, href=href, className='nav-link') )) return html.Nav( className=f'navbar', children=[ html.Ul( className=f'nav', children=nav_items ), ], **kwargs, )
def navbar(*args, **kwargs): """ """ return html.Div(children=[ html.Div(children=[ dcc.Link(href="/", children=[ html.I(className="fab fa-earlybirds mr-3"), html.Span(children='Tanager', className="font-semibold") ]), ], className='mt-8 text-white space-x-5 text-2xl mx-2'), html.Div(children=[ dcc.Input( id="experiment-filter", name="experiment-filter", type="text", placeholder="Filter by name", className= "w-2/3 focus:ring-4 focus:ring-blue-300 py-2 px-4 rounded-full", ), html.Button(id='dir-refresh', className='text-white active:text-blue-500', title="Refresh expreiment list", children=[html.I(className='fas fa-redo-alt')]), ], className='flex justify-around my-4'), html.Nav(*args, className="overflow-y-auto h-5/6", **kwargs) ], className= 'w-52 lg:w-64 bg-gray-900 flex flex-col flex-none text-center h-auto' )
def header(): return html.Header(children=[ html.Nav( className="grey darken-3", children=[ html.Div( className="nav-wrapper", children=[ html.A(style={"margin-left": "1%"}, href="#", className="brand-logo", children="De olho no Metrô"), html.Ul(className="right hide-on-med-and-down", children=[ html.Li(className="active", children=html.A( href="", children="Relatório dia")), html.Li(children=html.A( href="", children="Relatório mês")), html.Li(children=html.A(href="", children="Sobre")), html.Li(children=html.A( className= "waves-effect waves-light btn", href="", children="Baixar os dados")), ]) ]) ]), ])
def Navbar(children=None, items=None, current_path=None, first_root_nav=True, **kwargs): items = items or [] nav_items = [] for i, (path, text) in enumerate(items): href = get_url(path) url_base_pathname = server.config['URL_BASE_PATHNAME'] # bool indicating if: on the root url and this is the first nav item is_first_root_nav = (current_path == url_base_pathname) and (i == 0) # active if we are on the path of this nav item, or if first_root_nav # is enabled and applies for this path is_active = (current_path == href) or \ (first_root_nav and is_first_root_nav) className = 'nav-item active' if is_active else 'nav-item' nav_items.append( html.Li(className=className, children=Link(text, href=href, className='nav-link'))) return html.Nav( className=f'navbar', children=[ html.Ul(className=f'nav', children=nav_items), ], **kwargs, )
def main_layout(controls, content, footer): layout_out = [ html.Div(children=[ html.Nav(children=[ html.Button([ html.Span("apps", className="material-icons") ], className="navbar-toggler", type="button", **{ 'aria-expanded': 'false', "aria-label": "Toggle navigation", 'data-toggle': "collapse", "data-target": "#navbarSupportedContent", "aria-controls": "navbarSupportedContent" } ), html.Div(children=[ html.Ul([ html.Li(html.A("Chart OHLC", href="#", className="nav-link active"), className="nav-item"), html.Li(html.A("Link 1", href="#", className="nav-link"), className="nav-item"), html.Li(html.A("Link 2", href="#", className="nav-link"), className="nav-item") ], className="navbar-nav mr-auto") ], className="collapse navbar-collapse", id="navbarSupportedContent") ], className="navbar navbar-expand-sm navbar-dark", style={"background-color": "#000000"}) ], className="container border-light border-bottom"), controls, content, footer ] return layout_out
def components_tree(self): nav_bar_brand = html.A(self.brand_name, className="navbar-brand text-white") nav_bar_sandwich_btn = html.Button(**{"data-toggle": "collapse", "data-target": "#"+self.collapse_id, "aria-controls": self.collapse_id, "aria-expanded": "false", "aria-label": "Toggle navigation", "type": "button"}, id="idShowOrHideLink", className="navbar-toggler", children=[ html.Span(className="navbar-toggler-icon") ]) nav_bar_links = html.Ul(className="navbar-nav mr-auto", children=self.drop_menus) nav_bar_collapse = html.Div(className="navbar-collapse collapse", id=self.collapse_id, children=[nav_bar_links]) nav_bar = html.Nav(className="navbar navbar-expand-md navbar-dark bg-dark", children = [nav_bar_brand, nav_bar_sandwich_btn, nav_bar_collapse, ]) return nav_bar
def layout(pathname='/'): header_links = [ { 'href': "", 'title' : "", 'text': "Github" } ] tab_links = [ { 'href': "/", 'title' : "", 'text': "Home" }, { 'href': "/about", 'title' : "", 'text': "About Magicbox Reports" } ] return html.Header( children= [ html.A( className="skip", href="#contents", tabIndex="0", children=["Skip content"]), html.Nav(className="navbar navbar-expand-md flex-md-row bd-navbar p-0", children=[ html.A( className="navbar-brand navbar-line mr-3", href="/", title="Go home", children=[ html.Img(className="img-fluid d-none d-lg-block", alt="", src="/assets/unicef-logo.svg") ]), html.A(className="navbar-brand mr-0", href="/", title="Go home", children=[ "Magicbox Reports" ]), header_links_layout(header_links), html.Button( className='navbar-toggler', type="button" , **{ 'data-toggle': "collapse", 'data-target': "#navbarSupportedContent", 'aria-controls': 'navbarSupportedContent', 'aria-expanded': 'false', 'aria-expanded': 'Toggle navigation' }, children=[ html.Span(className="navbar-toggler-icon", children=[ html.I(className="fa fa-bars") ]) ]) # Button ]), # Nav tab_links_layout(tab_links, pathname) ]) # Header #<button class="navbar-toggler" type="button" data-toggle="collapse" # data-target="#navbarSupportedContent" # aria-controls="navbarSupportedContent" # aria-expanded="false" # aria-label="Toggle navigation"> # <span class="navbar-toggler-icon"><i class="fas fa-bars"></i></span> # </button>
def Navbar(title): """Returns a Navbar component Keyword arguments: title -- string to display in Navbar """ return html.Nav( className="navbar ", children=[html.A(children=[title], className="navbar-brand")])
def Topbar(): """Top text to be display on the views""" topbar = html.Nav( className= "navbar navbar-expand-lg navbar-absolute fixed-top navbar-transparent", children=[ html.Div( className="container-fluid", children=[ html.Div( className="navbar-wrapper", children=[ html.Div( className="navbar-toggle", children=[ html.Button( id="sidebar-toggle", className="navbar-toggler", children=[ html.Span( className= "navbar-toggler-bar bar1"), html.Span( className= "navbar-toggler-bar bar2"), html.Span( className= "navbar-toggler-bar bar3"), ]) ]), html.A(className="navbar-brand", children=[ html.B("Teaté Colombia S.A.S"), html.Br(), html.Label( "Demand Forecast per Manufacture") ]) ]), html.Div( className="logout text-center", children=[ html.Div( className="nav", children=[ html.A( href="/logout", children=[ html.I( className="fa fa-power-off"), html.P("Log Out", style={'color': '#E73D2A'}) ]) ]) ]) ]) ]) return topbar
def create_header(): return html.Nav(className='navbar navbar-expand-lg navbar-light', style={'background-color': 'white'}, children=[ html.Img(src='assets/bzk-ssc_ict-vng-logo.png', width='375', height='75', style={'margin': 'auto'}) ])
def Navbar(app: Dash, download: bool = False): return html.Nav([ html.Div([ dcc.Link([ html.Img(src=app.get_asset_url("logo-black.png")), html.Span("Compliance: The Basics") ], href="/home", className="nav-brand"), html.Ul(generate_nav_links(download=download), className="nav-links", id="nav-list") ], className="nav-container") ], className="navigation bg-nav")
def new(): r = html.Div( className='mdl-layout__drawer', children=[ html.Nav( className='mdl-navigation mdl-list__item', style={'height': '100%'}, children=[ mdl_A('LISTA DE IMÁGENES', 'publish', btns_style, id='btn_loadimg'), mdl_A('DETALLE DE IMÁGENES', 'analytics', btns_style, id='btn_meta'), mdl_A('CLASIFICAR IMÁGENES', 'image_search', btns_style, id='btn_class'), html.Hr(style={'margin-bottom': '0'}), html.Div([ html.Div( className='mdl-card mdl-shadow--2dp input-panel', id='view_gdrive', hidden=True, children=panel_gdrive(), style={'margin-top': '12px'}), html.Div( className='mdl-card mdl-shadow--2dp input-panel', id='view_folders', hidden=True, children=panel_folders(), style={'margin-top': '12px'}), html.Div( className='mdl-card mdl-shadow--2dp input-panel', id='view_param', hidden=False, children=panel_param(), style={'margin-top': '12px'}), ], id='view_container'), html.Div(className='mdl-layout-spacer'), # html.Div(id='nav_bottom_box', children=[ # html.Div(id='debug_output', children=''), # #html.Hr(style={'margin-bottom': '12px'}), # #mdl_A('RE-ENTRENAR', 'autorenew'), # #mdl_A('PARÁMETROS', 'settings'), # ]) ]) ]) return (r)
def SetupDashApp(app): app.css.append_css( {'external_url': 'https://codepen.io/amyoshino/pen/jzXypZ.css'}) dcc._css_dist[0]['relative_package_path'].append('datatable.css') app.layout = html.Div([ html.Link(rel='stylesheet', href='/static/stylesheet.css'), html.Div( className='row', children=[ html.Div([ html.Nav(className="navbar", children=[ html.A('Main', className="navbar", href='/dbSTR'), html.A('FAQ', className="navbar", href='/faq') ]), html.Label('Enter Gene:', style={'font-weight': 'bold'}), dcc.Location(id='url', refresh=False), dcc.Input(id='field-dropdown', type='text', value=[{}]) ]), html.Div( [ html.Div(id='selected-indexes'), dcc.Graph(id='Main-graphic', style={ 'height': 400, 'width': 600 }), dt.DataTable( # Initialise the rows rows=[{}], row_selectable=True, filterable=True, sortable=True, selected_row_indices=[], id='STRtable'), dt.DataTable( # Initialise the rows rows=[{}], row_selectable=True, filterable=True, sortable=True, selected_row_indices=[], id='table2'), html.Div(id='selected-indexes') ], style={ 'height': '25%', 'display': 'block' }) ]) ])
def get_app_layout(app): return html.Div([ dcc.Location(id='url'), html.Nav([ dcc.Link([html.Img(src=app.get_asset_url('/img/home.png'))], href="/"), html.H1("Statistiques liées à l'impact du covid19") ]), html.H2(), html.Div(id='page-content') ])
def _create_bottombar(): return html.Div( children=[ html.Nav( className="bottombar", children=[ html.P( "Team Leto - copyright 2020", ) ], ) ] )