layout.py

# Copyright 2022 Coinbase Global, Inc.
#
# Licensed under the Apache License, Version 2.0 (the "License");
# you may not use this file except in compliance with the License.
# You may obtain a copy of the License at
#
# http://www.apache.org/licenses/LICENSE-2.0
#
# Unless required by applicable law or agreed to in writing, software
# distributed under the License is distributed on an "AS IS" BASIS,
# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
# See the License for the specific language governing permissions and
# limitations under the License.
from dash import html, dcc

layout = html.Div(
    children=[
        html.H1(children="Coinbase Prime trading application"),
        html.Div(id="price-ref", style={"padding-top": 10, "font-size": "22px"}),
        html.Div(
            id="portfolio-bal",
            style={"padding-top": 10, "padding-bottom": 30, "font-size": "22px"},
        ),
        html.Div(
            [
                dcc.Dropdown(
                    [
                        "ETH-USD",
                        "BTC-USD",
                        "CRV-USD",
                        "SOL-USD",
                        "CBETH-USD",
                        "CBETH-ETH",
                    ],
                    "ETH-USD",
                    id="product-switcher",
                    clearable=False,
                    style={"width": "150px"},
                ),
                dcc.Dropdown(
                    options={
                        "60": "1m",
                        "300": "5m",
                        "900": "15m",
                        "3600": "1h",
                        "21600": "6h",
                        "86400": "1d",
                    },
                    value="3600",
                    id="gran-switcher",
                    clearable=False,
                    style={"width": "150px"},
                ),
            ]
        ),
        dcc.Graph(id="product-chart", style={"width": "90%"}),
        html.H1(children="Buy/Sell"),
        html.Div(dcc.Input(id="amount-box", placeholder="quantity", type="text")),
        dcc.Dropdown(
            ["BUY", "SELL"],
            "BUY",
            id="buy-sell-toggle",
            clearable=False,
            style={"width": "150px"},
        ),
        html.Button("Submit", id="submit-button", n_clicks=0),
        html.Div(id="buy-sell-response", style={"padding-top": 10}),
    ],
    style={"padding": 30, "flex": 1, "font-family": "Inter"},
)