quickdash_firstpage.py

firstpage = [
    dbc.Row([
        dbc.Col([
            html.H3('FINANCIAL ASSISTANT DASHBOARD', className='text-center mb-3 p-3'),
            html.Hr(),
        ],
            width={'size': 12, 'offset': 0, 'order': 0}),
    ]),
    dbc.Row([
        dbc.Col([
            html.H6('Select the stock you want to look into:', className='text-center mb-2 p-1'),
            dcc.Dropdown(
                id = 'stock-dropdown',
                options = dd_labels,
                value = dd_labels[0]['label'],
                clearable=False,
            ),
            html.Div(id='comp', className='text-center mt-3 p-2'),
            html.Div(id='pri', className='text-center p-2'),
            html.Div(id='sec', className='text-center p-2'),
            html.Div(id='ind', className='text-center p-2'),
            html.Div(id='p/e', className='text-center p-2'),

        ],
            width={'size': 4, 'offset': 0, 'order': 0}),

        dbc.Col([
            html.H5('2Y Price History', className='text-center p-1'),
            dcc.Graph(id='pricechart', style={'height': 400}),
        ],
            width={'size': 8, 'offset': 0, 'order': 0}),
    ]),
    dbc.Row([
        dbc.Col([
            html.H5('Revenue', className='text-center'),
            html.H6('Millions of $', className='text-center font-italic'),
            dcc.Graph(id='revenuechart', style={'height': 350}),
            html.H5('Net Profit Margin', className='text-center'),
            html.H6('%', className='text-center font-italic'),
            dcc.Graph(id='netprofitmargchart', style={'height': 350}),
        ],
            width={'size': 4, 'offset': 0, 'order': 0}),
        dbc.Col([
            html.H5('Net Income', className='text-center'),
            html.H6('Millions of $', className='text-center font-italic'),
            dcc.Graph(id='ebitdachart', style={'height': 350}),
            html.H5('Cash On Hand', className='text-center'),
            html.H6('Millions of $', className='text-center font-italic'),
            dcc.Graph(id='freecashchart', style={'height': 350}),
        ],
            width={'size': 4, 'offset': 0, 'order': 0}),
        dbc.Col([
            html.H5('Total Liabilities', className='text-center'),
            html.H6('Millions of $', className='text-center font-italic'),
            dcc.Graph(id='debtchart', style={'height': 350}),
            html.H5('Shares Outstanding', className='text-center'),
            html.H6('Millions', className='text-center font-italic'),
            dcc.Graph(id='shareschart', style={'height': 350}),
        ],
            width={'size': 4, 'offset': 0, 'order': 0}),
    ]),
]