Merge pull request #8 from mayushii21/development

interface adjustments
mayushii21 · Oct 11, 2023 · def1f42 · def1f42
2 parents 2cc7eb0 + c05f83f
commit def1f42
Show file tree

Hide file tree

Showing 6 changed files with 27 additions and 19 deletions.
diff --git a/src/innov8/components/charts_52w.py b/src/innov8/components/charts_52w.py
@@ -19,8 +19,8 @@ def carousel_52_week():
         autoplay=True,
         speed=3000,
         style={
-            "height": 230,
-            "width": 290,
+            "height": 280,
+            "width": 357,
         },
         responsive=[
             {"breakpoint": 9999, "settings": {"arrows": False}},
@@ -67,8 +67,8 @@ def update_52_week_charts(data, symbol, theme, update):
         font_size=9,
         plot_bgcolor="rgba(0,0,0,0)",
         paper_bgcolor="rgba(0,0,0,0)",
-        height=230,
-        width=290,
+        height=280,
+        width=357,
         margin=dict(l=1, r=1, b=0, t=0),
         showlegend=False,
     )
@@ -143,8 +143,8 @@ def update_52_week_charts(data, symbol, theme, update):
         font_size=9,
         plot_bgcolor="rgba(0,0,0,0)",
         paper_bgcolor="rgba(0,0,0,0)",
-        height=230,
-        width=290,
+        height=280,
+        width=357,
         margin=dict(l=1, r=1, b=0, t=0),
         showlegend=False,
     )

diff --git a/src/innov8/components/intra_sector.py b/src/innov8/components/intra_sector.py
@@ -72,7 +72,7 @@ def table_info():
                 ],
                 style_header={"backgroundColor": "rgba(0,0,0,0)"},
                 style_data={"backgroundColor": "rgba(0,0,0,0)"},
-                style_table={"height": "100px", "overflowY": "auto"},
+                style_table={"height": "180px", "overflowY": "auto"},
                 style_as_list_view=True,
             ),
         ]

diff --git a/src/innov8/components/price_card.py b/src/innov8/components/price_card.py
@@ -9,19 +9,19 @@ def price_card():
     return html.Div(
         [
             # Symbol
-            html.H4(
+            html.H2(
                 id="ticker-symbol",
                 style={
                     "textAlign": "left",
-                    "marginTop": 10,
+                    "marginTop": 0,
                     "marginBottom": -7,
                 },
             ),
             # Name
             html.P(
                 id="ticker-name",
                 style={
-                    "fontSize": "12px",
+                    "fontSize": "14px",
                     "textAlign": "left",
                     "marginBottom": -7,
                 },
@@ -30,7 +30,7 @@ def price_card():
             html.P(
                 id="ticker-price",
                 style={
-                    "fontSize": "27px",
+                    "fontSize": "33px",
                     "textAlign": "right",
                     "marginBottom": -7,
                 },
@@ -44,7 +44,7 @@ def price_card():
                 id="exchange-name",
                 style={
                     "textAlign": "left",
-                    "fontSize": "14px",
+                    "fontSize": "19px",
                     "marginBottom": -3,
                 },
             ),
@@ -53,12 +53,12 @@ def price_card():
                 id="economic-sector",
                 style={
                     "textAlign": "left",
-                    "fontSize": "14px",
+                    "fontSize": "19px",
                 },
             ),
         ],
         id="ticker-data",
-        style={"height": "140px"},
+        style={"height": "190px"},
     )
 
 
@@ -89,7 +89,7 @@ def update_symbol_data(data, symbol, update):
         f"{current_price:.2f} ({ticker.iat[0, 4]})",  # (currency)
         f"{'+' if change > 0 else ''}{change:.2%}",
         {
-            "fontSize": "14px",
+            "fontSize": "17px",
             "textAlign": "right",
             "marginBottom": -3,
             "color": "green" if change > 0 else "red",

diff --git a/src/innov8/components/price_chart.py b/src/innov8/components/price_chart.py
@@ -178,6 +178,7 @@ def update_price_chart(data, symbol, ema, sma, ema_period, sma_period, theme, up
             showgrid=False,
             # tickprefix="$"
         ),
+        height=600,
     )
 
     def plot_line(indicator):

diff --git a/src/innov8/components/update.py b/src/innov8/components/update.py
@@ -26,10 +26,17 @@ def update_button():
                 options=["Ticker", "Sector", "All"],
                 value="Ticker",
                 id="update-dropdown",
-                style={"width": "8vw", "height": "37px"},
+                style={
+                    "width": "70%",
+                    "height": "37px",
+                    "border-top-left-radius": 0,  # squarify :]
+                    "border-bottom-left-radius": 0,
+                },
                 clearable=False,
             ),
-        ]
+        ],
+        # style={"padding-left": "4em", "margin-left": "auto", "margin-right": 0},
+        style={"width": "100%"},
     )
 
 

diff --git a/src/innov8/layout.py b/src/innov8/layout.py
@@ -14,7 +14,7 @@
 # Pool (combine) the layout
 app.layout = dbc.Container(
     [
-        # A carousel for 10 tickers with the largest absolute change occupies the topmost row
+        # A carousel for 10 tickers with the largest absolute change occupying the topmost row
         dbc.Row([dbc.Col([carousel()], width=12)]),
         dbc.Row(
             [
@@ -33,7 +33,7 @@
                                             type="dot",
                                         )
                                     ],
-                                    width=3,
+                                    width={"size": 3, "offset": 1},
                                 ),
                             ],
                             class_name="mb-1",