improved templates

rio/cli/project_setup.py

@@ -127,7 +127,7 @@ from . import components as comps
 theme = rio.Theme.from_colors(
     primary_color=rio.Color.from_hex("{default_theme.primary_color.hexa}"),
     secondary_color=rio.Color.from_hex("{default_theme.secondary_color.hexa}"),
-    mode="dark",
+    mode="light",
 )
 """
         )

rio/snippets/project_template.py

@@ -207,8 +207,6 @@ class ProjectTemplate:
 
             if dir_name == "assets":
                 asset_snippets.append(snippet)
-            # if "assets" in snippet.file_path.parts:
-            #     asset_snippets.append(snippet)
 
             elif snippet.file_path.name == "root_init.py":
                 assert root_init_snippet is None
@@ -226,8 +224,6 @@ class ProjectTemplate:
                 ".webp",
             ]:
                 asset_snippets.append(snippet)
-            # else:
-            #     assert False, f"Unrecognized snippet file `{snippet.file_path}`"
 
             else:
                 assert False, f"Unrecognized snippet file `{snippet.file_path}`"

rio/snippets/snippet-files/project-template-Authentication/components/__init__.py

@@ -1,4 +1,3 @@
-from .footer import Footer as Footer
 from .navbar import Navbar as Navbar
 from .news_article import NewsArticle as NewsArticle
 from .root_component import RootComponent as RootComponent

rio/snippets/snippet-files/project-template-Authentication/components/navbar.py

@@ -51,6 +51,9 @@ class Navbar(rio.Component):
         self.session.navigate_to("/")
 
     def build(self) -> rio.Component:
+        # Determine the layout based on the window width
+        desktop_layout = self.session.window_width > 30
+
         try:
             # Which page is currently active? This will be used to highlight the
             # correct navigation button.
@@ -199,7 +202,7 @@ class Navbar(rio.Component):
                 # Since the navbar isn't supposed to take up all space, align
                 # it.
                 align_y=0,
-                margin_x=5,
+                margin_x=2 if desktop_layout else 0.5,
                 margin_y=2,
             ),
         )

rio/snippets/snippet-files/project-template-Authentication/components/user_sign_up_form.py

@@ -125,6 +125,9 @@ class UserSignUpForm(rio.Component):
         self.popup_open = False
 
     def build(self) -> rio.Component:
+        # Determine the layout based on the window width
+        desktop_layout = self.session.window_width > 30
+
         return rio.Card(
             rio.Column(
                 # Heading
@@ -169,9 +172,11 @@ class UserSignUpForm(rio.Component):
                     margin_top=1,
                 ),
                 spacing=1,
-                margin=2,
+                margin=2 if desktop_layout else 1,
             ),
-            align_x=0.5,
+            margin_x=0.5,
+            align_x=0.5 if desktop_layout else None,
+            min_width=24 if desktop_layout else 0,
             align_y=0.5,
         )
 

rio/snippets/snippet-files/project-template-Authentication/meta.json

@@ -5,7 +5,6 @@
     "onSessionStart": "on_session_start",
     "defaultAttachments": ["data_models.UserSettings(auth_token=\"\")"],
     "rootComponent": "RootComponent",
-    "theme": "theme.THEME",
     "readyToRun": true,
     "supportsMobile": true
 }

rio/snippets/snippet-files/project-template-Authentication/pages/login_page.py

@@ -109,7 +109,8 @@ class LoginPage(rio.Component):
         self.popup_open = True
 
     def build(self) -> rio.Component:
-        # Create a banner with the error message if there is one
+        # Determine the layout based on the window width
+        desktop_layout = self.session.window_width > 30
 
         return rio.Card(
             rio.Column(
@@ -165,19 +166,13 @@ class LoginPage(rio.Component):
                     is_open=self.popup_open,
                     color="none",
                 ),
-                align_x=0.5,
-                min_width=(
-                    20
-                    if self.session.window_width >= 60
-                    else self.session.window_width - 8
-                    # TODO: fix this
-                ),
-                min_height=20,
                 spacing=1,
-                margin=2,
+                margin=2 if desktop_layout else 1,
             ),
-            align_x=0.5,
+            margin_x=0.5,
             align_y=0.5,
+            align_x=0.5 if desktop_layout else None,
+            min_width=24 if desktop_layout else 0,
         )
 
 

rio/snippets/snippet-files/project-template-Authentication/root_init.py

@@ -5,7 +5,7 @@ from datetime import datetime, timedelta, timezone
 
 import rio
 
-from . import data_models, persistence, theme
+from . import data_models, persistence
 
 # </additional-imports>
 
@@ -67,11 +67,3 @@ async def on_session_start(rio_session: rio.Session) -> None:
 
 
 # </additional-code>
-
-
-# Make sure ruff doesn't remove unused imports
-# Create the Rio app
-app = rio.App(
-    name="Authentication",
-    theme=theme.THEME,
-)

rio/snippets/snippet-files/project-template-Authentication/theme.py

@@ -1,6 +0,0 @@
-import rio
-
-THEME = rio.Theme.from_colors(
-    mode="dark",
-    heading_fill=rio.Color.from_hex("#ffffff"),  # Fill color for headings
-)

rio/snippets/snippet-files/project-template-Simple CRUD/pages/crud_page.py

@@ -176,7 +176,7 @@ class CrudPage(rio.Component):
                 spacing=1,
                 align_y=0,
                 margin=2,
-                min_width=30,
+                align_x=0.5,
             )
 
         def on_change_name(ev: rio.TextInputChangeEvent) -> None: