[
html.Div(
children=[
#nav bar
html.Nav(
#inside div
html.Div(
children=[
html.A(logo_small_thumb,
className='brand-logo',
href='/'),
#ul list components
html.Ul(
children=[
html.Li(
html.I(id='home',
className='fa fa-home')),
html.Li(html.A('Home', href='/')),
html.Li(
html.I(id='search',
className='fa fa-search')),
html.Li(
html.A('Data Explorer',
href='/apps/databasenav')),
html.Li(
html.I(id='search',
className='fa fa-asterisk')),
html.Li(
html.A(
'Generate Structural Signatures',
href='/apps')),
# html.Li(html.I(id='search', className='fa fa-users')),
#dcc._css_dist[0]["relative_package_path"].append("styles.css")
app.css.config.serve_locally = True
cityName = ""
countryName = ""
stateName = ""
currentTemp = 0
currentHumidity = 0
customTemp = 0
customHumidity = 0
bufDefault = 0
bufCollpse = 0
flu_20 = dbc.Col([
dbc.Row([
dbc.Col(html.I([], className='fas fa-male white'), width="auto"),
dbc.Col(html.I([], className='fas fa-male white'), width="auto"),
dbc.Col(html.I([], className='fas fa-male white'), width="auto"),
dbc.Col(html.I([], className='fas fa-male white'), width="auto"),
dbc.Col(html.I([], className='fas fa-male red'), width="auto"),
],
className="male-icons fitContent"),
dbc.Row(
dbc.Col(
html.Div("REDUCED RISK OF FLU TRANSMITION",
className="text-center font-lg top32 bold")))
],
width={'width': 8},
className="boxed bottom40 bgGray radius32 padding40")
flu_40 = dbc.Col([
],
sticky="top",
color="dark",
light=False,
dark=True,
style={"height": "15px"},
)
footer = dbc.Container(
dbc.Row(
dbc.Col(
html.P(
[
html.Span("Quake Labs", className="mr-2"),
html.A(
html.I(className="fas fa-envelope-square mr-1"),
href="mailto:[email protected]",
),
html.A(
html.I(className="fab fa-github-square mr-1"),
href="https://github.com/quake-labs",
),
],
className="lead",
))))
# For more explanation, see:
# Plotly Dash User Guide, URL Routing and Multiple Apps
# https://dash.plot.ly/urls
app.layout = html.Div([
html.H1('一级标题', id='demo1'),
html.H2('二级标题'),
html.H3('三级标题'),
html.H4('四级标题'),
html.H5('五级标题'),
html.H6('六级标题'),
html.Br(), # 换行
html.Hr(), # 水平分割线
html.P('这是一段文字。' * 20),
html.P('这是另一段带有首行缩进的文字。' * 10, style={'text-indent': '3rem'}),
html.A('跳转到费弗里的Github仓库',
target='_blank',
href='https://github.com/CNFeffery/DataScienceStudyNotes'
), # 跳转到外部链接
html.Br(),
html.A('跳转到六级标题', href='#demo2'),
html.P([
'一段文字中出现了',
html.I('斜体'), '，以及代码片段',
html.Code('import dash'), '，还有一段',
html.U('带下划线的文字'), '，一段',
html.Mark('高亮标注文字'), '，以及另一段',
html.Mark('不同颜色的高亮标注文字。',
style={'background-color': 'lightblue'})
])
] + [html.Br()] * 50 +
[html.A('回到顶端一级标题', href='#demo1'),
html.H1('页内元素跳转示例标题', id='demo2')]))
if __name__ == '__main__':
app.run_server(debug=True)
yanchor="auto",
bgcolor='rgb(49, 48, 53)'),
paper_bgcolor='rgb(49, 49, 53)',
plot_bgcolor='rgb(49, 49, 53)',
font={
'color': 'rgb(52,224,175)',
'size': 12
},
margin=go.layout.Margin(l=40, r=0, t=100, b=40))
social_share_links = [
html.
A(title="",
children=[
html.I(id='share-twitter',
n_clicks=0,
className='fa fa-twitter fa-2x')
],
href=
'https://twitter.com/intent/tweet?url=http://data.cryptoresearch.report/graph/asset_alloc_gold_vs_sov',
target="_blank",
style={
'text-decoration': 'none',
'padding-left': '10px'
}),
html.
A(title="",
children=[
html.
I(id='share-facebook', n_clicks=0, className='fa fa-facebook fa-2x')
],
def update_output(clicks, input_value):
if clicks is not None:
# print("Hello")
# print(clicks)
hyperschedule_input = json.loads(input_value)
data = []
for course in hyperschedule_input:
courses_costs = {}
courseCode = course["courseCode"]
courses_costs["Course Code"] = courseCode
courses_costs["Course Name"] = course["courseName"]
if False: # courseCode in course_ratings_dict: # TODO: Change this
courses_costs["Rating"] = course_ratings_dict[courseCode]
else:
courses_costs["Rating"] = 0
data.append(courses_costs)
selectable_columns = [i for i in range(len(data))]
courses_datatable = dash_table.DataTable(
id="courses-table",
columns=[{
"name": i,
"id": i,
"editable": j
} for i, j in [
("Course Code", False),
("Course Name", False),
("Rating", True),
]],
data=data,
sort_action="native",
sort_mode="single",
column_selectable="multi",
row_selectable="multi",
selected_rows=selectable_columns,
page_action="native",
style_header={
"backgroundColor": "rgb(30, 30, 30)",
"color": "white"
},
style_table={
"height": table1Height,
"width": table1Width,
"overflowY": "auto",
},
style_cell={
"backgroundColor": bgString,
"color": "black",
"overflow": "hidden",
"textOverflow": "ellipsis",
"textAlign": "left",
"fontSize": table1FontSize,
},
style_data_conditional=[
{
"if": {
"column_id": "Rating"
},
"backgroundColor": "#32a893",
"color": "white",
"text-align": "center",
},
{
"if": {
"state": "active"
},
"backgroundColor": "rgb(200, 200, 200)",
"border": "1px solid rgb(0, 116, 217)",
},
{
"if": {
"state": "selected"
},
"backgroundColor": "rgb(200, 200, 200)",
"border": "1px solid rgb(0, 116, 217)",
},
],
)
requirements_table = dash_table.DataTable(
id="requirements-table",
columns=[{
"name": i,
"id": i,
"deletable": True
} for i in requirements_template_df.columns],
data=requirements_template_df.to_dict("records"),
editable=True,
page_action="none",
style_header={
"backgroundColor": "rgb(30, 30, 30)",
"color": "white"
},
# style_data={
# 'height': 'auto'
# },
style_cell={
"backgroundColor": bgString,
"color": "black",
"whiteSpace": "normal",
"minWidth": "250px",
# 'maxWidth': '200px',
"width": "250px",
"height": "auto",
"textAlign": "center",
"fontSize": table2FontSize,
},
style_table={
"height": table2Height,
"width": table2Width,
"overflowY": "auto",
"overflowX": "auto",
},
)
final_button = dbc.Button(
id="submit-button-2",
type="submit",
children="Calculate the Optimal Course Schedule!",
size="lg",
color="primary",
className="mr-1"
# style={"width": "600px", "height": "100px"}
)
add_col_button = dbc.Button(
"Add Requirement",
id="adding-cols-button",
color="success",
className="mr-1",
size="rg",
style={
"marginLeft": 75,
"fontSize": 25
},
)
rating_instructions_modal = html.Div([
dbc.Button("Open", id="open-centered"),
dbc.Modal(
[
dbc.ModalHeader("Header"),
dbc.ModalBody("This modal is vertically centered"),
dbc.ModalFooter(
dbc.Button("Close",
id="close-centered",
className="ml-auto")),
],
id="modal-centered",
centered=True,
),
])
requirement_instructions_modal = html.Div([
dbc.Button("Open", id="open-centered-2"),
dbc.Modal(
[
dbc.ModalHeader("Header"),
dbc.ModalBody("This modal is vertically centered"),
dbc.ModalFooter(
dbc.Button("Close",
id="close-centered",
className="ml-auto")),
],
id="modal-centered-2",
centered=True,
),
])
return [
{
"display": "none"
},
[
dbc.Row(
[
html.H2(
"Enter Your Course Ratings: ",
style={
"textAlign": "center",
},
),
dbc.Button(
[html.I(className="fa fa-question-circle"), ""],
color="info",
style={"marginLeft": 75},
),
],
justify="center",
align="center",
style={"marginTop": 50},
),
dbc.Row([courses_datatable], align="center", justify="center"),
dbc.Row(
[
html.H2("Requirements: ", style={"fontSize": 45}),
add_col_button,
dbc.Button(
[html.I(className="fa fa-question-circle"), ""],
color="info",
style={"marginLeft": 150},
),
],
justify="center",
align="center",
style={"marginTop": 50},
),
dbc.Row(
[requirements_table],
justify="center",
align="center",
),
dbc.Row(
dbc.Col(
[final_button],
width={
"size": 6,
"offset": 2
},
style={"marginTop": 50},
),
justify="center",
),
],
]
else:
return (no_update, no_update)
dbc.NavItem(
dcc.Link('Magnitude Insights',
href='/insights',
className='nav-link')),
],
sticky='top',
color='light',
light=True,
dark=False)
footer = dbc.Container(
dbc.Row(
dbc.Col(
html.P([
html.Span('Your Name', className='mr-2'),
html.A(html.I(className='fas fa-envelope-square mr-1'),
href='mailto:<you>@<provider>.com'),
html.A(html.I(className='fab fa-github-square mr-1'),
href='https://github.com/<you>/<repo>'),
html.A(html.I(className='fab fa-linkedin mr-1'),
href='https://www.linkedin.com/in/<you>/'),
html.A(html.I(className='fab fa-twitter-square mr-1'),
href='https://twitter.com/<you>'),
],
className='lead'))))
# For more explanation, see:
# Plotly Dash User Guide, URL Routing and Multiple Apps
# https://dash.plot.ly/urls
app.layout = html.Div([
active=False),
dbc.Popover(id="about",
is_open=False,
target="about-popover",
children=[
dbc.PopoverHeader("How it works"),
dbc.PopoverBody(about.txt)
])
])),
## links
dbc.DropdownMenu(
label="Links",
nav=True,
children=[
dbc.DropdownMenuItem(
[html.I(className="fa fa-linkedin"), " Contacts"],
href=config.contacts,
target="_blank"),
dbc.DropdownMenuItem(
[html.I(className="fa fa-github"), " Code"],
href=config.code,
target="_blank")
])
])
# Input
inputs = dbc.FormGroup([
html.H4("Select Country"),
dcc.Dropdown(id="country",
options=[{
"label": x,
def fa(className):
"""A convenience component for adding Font Awesome icons"""
return html.I(className=f"{className} mx-1")