Update app.py

app.py

@@ -137,11 +137,10 @@ from shiny import App, reactive, ui, render
 from shiny.ui import h2, tags
 
 # Define the UI layout for the app
-app_ui = ui.page_fluid(
-
-
+app_ui = ui.page_sidebar(
+    # Header content
     ui.tags.div(
-         {"style": "width:90%;margin: 0 auto;max-width: 1600px;"},
+        {"style": "width:90%;margin: 0 auto;max-width: 1600px;"},
         ui.tags.style(
             """
             h4 {
@@ -151,61 +150,55 @@ app_ui = ui.page_fluid(
                 font-size:25px;
             }
             """
-         ),
-
-    ui.tags.h4("TJStats"),
-    ui.tags.i("Baseball Analytics and Visualizations"),
-    ui.markdown("""<a href='https://x.com/TJStats'>Follow me on Twitter</a><sup>1</sup>"""),
-    ui.markdown("""<a href='https://www.patreon.com/tj_stats'>Support me on Patreon for Access to 2024 Apps</a><sup>1</sup>"""),
-
-    ui.markdown("### MiLB Statcast Batting Summaries"),
-    ui.markdown("""This Shiny App allows you to generate Baseball Savant-style percentile bars for MiLB players in the 2024 Season. 
-                Currently, MiLB Statcast is only available for AAA and A (Florida State League) level.
-                """),
-    ui.markdown("""
-    For ease of sharing, you can right-click (desktop) or press+hold (mobile) to save/copy the image.
-    """),
-
-    ui.layout_sidebar(
-        ui.panel_sidebar(
-            # Row for selecting season and level
-            ui.row(
-                ui.column(6, ui.input_select('year_input', 'Select Season', year_list, selected=2024)),
-                ui.column(6, ui.input_select('level_input', 'Select Level', level_dict)),
-            ),
-            # Row for the action button to get player list
-            ui.row(ui.input_action_button("player_button", "Get Player List", class_="btn-primary")),
-            # Row for selecting the player
-            ui.row(ui.column(12, ui.output_ui('player_select_ui', 'Select Player'))),
-
-            ui.row(
-                ui.column(6, ui.input_switch("switch", "Custom Team?", False)),
-                ui.column(6, ui.input_select('logo_select', 'Select Custom Logo', image_dict_flip, multiple=False))
-            ),
-            
-            # Row for the action button to generate plot
-            ui.row(ui.input_action_button("generate_plot", "Generate Plot", class_="btn-primary")),
-            width=3,
         ),
-                
-        ui.panel_main(
-            ui.navset_tab(
-                # Tab for game summary plot
-                ui.nav("Batter Summary",
-                       ui.output_text("status_batter"),
-                       ui.output_plot('batter_plot', width='1200px', height='1200px')
-                ),
-                ui.nav("Pitcher Summary",
-                       ui.output_text("status_pitcher"),
-                       ui.output_plot('pitcher_plot', width='1200px', height='1200px')
-                )
-                ,id="tabset"
-            )
-        )
+        ui.tags.h4("TJStats"),
+        ui.tags.i("Baseball Analytics and Visualizations"),
+        ui.markdown("""<a href='https://x.com/TJStats'>Follow me on Twitter</a><sup>1</sup>"""),
+        ui.markdown("""<a href='https://www.patreon.com/tj_stats'>Support me on Patreon for Access to 2024 Apps</a><sup>1</sup>"""),
+        ui.markdown("### MiLB Statcast Batting Summaries"),
+        ui.markdown("""This Shiny App allows you to generate Baseball Savant-style percentile bars for MiLB players in the 2024 Season. 
+                    Currently, MiLB Statcast is only available for AAA and A (Florida State League) level.
+                    """),
+        ui.markdown("""
+        For ease of sharing, you can right-click (desktop) or press+hold (mobile) to save/copy the image.
+        """),
+    ),
+
+    # Sidebar content
+    ui.sidebar(
+        # Row for selecting season and level
+        ui.row(
+            ui.column(6, ui.input_select('year_input', 'Select Season', year_list, selected=2024)),
+            ui.column(6, ui.input_select('level_input', 'Select Level', level_dict)),
+        ),
+        # Row for the action button to get player list
+        ui.row(ui.input_action_button("player_button", "Get Player List", class_="btn-primary")),
+        # Row for selecting the player
+        ui.row(ui.column(12, ui.output_ui('player_select_ui', 'Select Player'))),
+
+        ui.row(
+            ui.column(6, ui.input_switch("switch", "Custom Team?", False)),
+            ui.column(6, ui.input_select('logo_select', 'Select Custom Logo', image_dict_flip, multiple=False))
+        ),
+        
+        # Row for the action button to generate plot
+        ui.row(ui.input_action_button("generate_plot", "Generate Plot", class_="btn-primary")),
+        width="400px"
+    ),
+    
+    # Main content area with tabs
+    ui.navset_tab(
+        ui.nav_panel("Batter Summary",
+               ui.output_text("status_batter"),
+               ui.output_plot('batter_plot', width='1200px', height='1200px')
+        ),
+        ui.nav_panel("Pitcher Summary",
+               ui.output_text("status_pitcher"),
+               ui.output_plot('pitcher_plot', width='1200px', height='1200px')
+        ),
+        id="tabset"
     )
 )
-)
-
 def server(input, output, session):
     @render.ui
     @reactive.event(input.player_button,input.tabset, ignore_none=False)