Make all styles reference examples capable of being run standalone

Also move the declarations of the stylesheets into the app classes.

See Textualize#3650

docs/examples/styles/align.py

@@ -3,9 +3,13 @@
 
 
 class AlignApp(App):
+    CSS_PATH = "align.tcss"
+
     def compose(self):
         yield Label("Vertical alignment with [b]Textual[/]", classes="box")
         yield Label("Take note, browsers.", classes="box")
 
 
-app = AlignApp(css_path="align.tcss")
+if __name__ == "__main__":
+    app = AlignApp()
+    app.run()

docs/examples/styles/align_all.py

@@ -18,3 +18,7 @@ def compose(self) -> ComposeResult:
         yield Container(Label("left bottom"), id="left-bottom")
         yield Container(Label("center bottom"), id="center-bottom")
         yield Container(Label("right bottom"), id="right-bottom")
+
+
+if __name__ == "__main__":
+    AlignAllApp().run()

docs/examples/styles/background.py

@@ -3,10 +3,14 @@
 
 
 class BackgroundApp(App):
+    CSS_PATH = "background.tcss"
+
     def compose(self):
         yield Label("Widget 1", id="static1")
         yield Label("Widget 2", id="static2")
         yield Label("Widget 3", id="static3")
 
 
-app = BackgroundApp(css_path="background.tcss")
+if __name__ == "__main__":
+    app = BackgroundApp()
+    app.run()

docs/examples/styles/background_transparency.py

@@ -5,6 +5,8 @@
 class BackgroundTransparencyApp(App):
     """Simple app to exemplify different transparency settings."""
 
+    CSS_PATH = "background_transparency.tcss"
+
     def compose(self) -> ComposeResult:
         yield Static("10%", id="t10")
         yield Static("20%", id="t20")
@@ -18,4 +20,6 @@ def compose(self) -> ComposeResult:
         yield Static("100%", id="t100")
 
 
-app = BackgroundTransparencyApp(css_path="background_transparency.tcss")
+if __name__ == "__main__":
+    app = BackgroundTransparencyApp()
+    app.run()

docs/examples/styles/border.py

@@ -3,10 +3,14 @@
 
 
 class BorderApp(App):
+    CSS_PATH = "border.tcss"
+
     def compose(self):
         yield Label("My border is solid red", id="label1")
         yield Label("My border is dashed green", id="label2")
         yield Label("My border is tall blue", id="label3")
 
 
-app = BorderApp(css_path="border.tcss")
+if __name__ == "__main__":
+    app = BorderApp()
+    app.run()

docs/examples/styles/border_all.py

@@ -4,6 +4,8 @@
 
 
 class AllBordersApp(App):
+    CSS_PATH = "border_all.tcss"
+
     def compose(self):
         yield Grid(
             Label("ascii", id="ascii"),
@@ -24,4 +26,6 @@ def compose(self):
         )
 
 
-app = AllBordersApp(css_path="border_all.tcss")
+if __name__ == "__main__":
+    app = AllBordersApp()
+    app.run()

docs/examples/styles/border_sub_title_align_all.py

@@ -13,6 +13,8 @@ def make_label_container(  # (11)!
 
 
 class BorderSubTitleAlignAll(App[None]):
+    CSS_PATH = "border_sub_title_align_all.tcss"
+
     def compose(self):
         with Grid():
             yield make_label_container(  # (1)!
@@ -68,7 +70,6 @@ def compose(self):
             )
 
 
-app = BorderSubTitleAlignAll(css_path="border_sub_title_align_all.tcss")
-
 if __name__ == "__main__":
+    app = BorderSubTitleAlignAll()
     app.run()

docs/examples/styles/border_subtitle_align.py

@@ -3,6 +3,8 @@
 
 
 class BorderSubtitleAlignApp(App):
+    CSS_PATH = "border_subtitle_align.tcss"
+
     def compose(self):
         lbl = Label("My subtitle is on the left.", id="label1")
         lbl.border_subtitle = "< Left"
@@ -17,4 +19,6 @@ def compose(self):
         yield lbl
 
 
-app = BorderSubtitleAlignApp(css_path="border_subtitle_align.tcss")
+if __name__ == "__main__":
+    app = BorderSubtitleAlignApp()
+    app.run()

docs/examples/styles/border_title_align.py

@@ -3,6 +3,8 @@
 
 
 class BorderTitleAlignApp(App):
+    CSS_PATH = "border_title_align.tcss"
+
     def compose(self):
         lbl = Label("My title is on the left.", id="label1")
         lbl.border_title = "< Left"
@@ -17,4 +19,6 @@ def compose(self):
         yield lbl
 
 
-app = BorderTitleAlignApp(css_path="border_title_align.tcss")
+if __name__ == "__main__":
+    app = BorderTitleAlignApp()
+    app.run()

docs/examples/styles/box_sizing.py

@@ -3,9 +3,13 @@
 
 
 class BoxSizingApp(App):
+    CSS_PATH = "box_sizing.tcss"
+
     def compose(self):
         yield Static("I'm using border-box!", id="static1")
         yield Static("I'm using content-box!", id="static2")
 
 
-app = BoxSizingApp(css_path="box_sizing.tcss")
+if __name__ == "__main__":
+    app = BoxSizingApp()
+    app.run()

docs/examples/styles/color.py

@@ -3,10 +3,14 @@
 
 
 class ColorApp(App):
+    CSS_PATH = "color.tcss"
+
     def compose(self):
         yield Label("I'm red!", id="label1")
         yield Label("I'm rgb(0, 255, 0)!", id="label2")
         yield Label("I'm hsl(240, 100%, 50%)!", id="label3")
 
 
-app = ColorApp(css_path="color.tcss")
+if __name__ == "__main__":
+    app = ColorApp()
+    app.run()

docs/examples/styles/color_auto.py

@@ -3,6 +3,8 @@
 
 
 class ColorApp(App):
+    CSS_PATH = "color_auto.tcss"
+
     def compose(self):
         yield Label("The quick brown fox jumps over the lazy dog!", id="lbl1")
         yield Label("The quick brown fox jumps over the lazy dog!", id="lbl2")
@@ -11,4 +13,6 @@ def compose(self):
         yield Label("The quick brown fox jumps over the lazy dog!", id="lbl5")
 
 
-app = ColorApp(css_path="color_auto.tcss")
+if __name__ == "__main__":
+    app = ColorApp()
+    app.run()

docs/examples/styles/column_span.py

@@ -4,6 +4,8 @@
 
 
 class MyApp(App):
+    CSS_PATH = "column_span.tcss"
+
     def compose(self):
         yield Grid(
             Placeholder(id="p1"),
@@ -16,4 +18,6 @@ def compose(self):
         )
 
 
-app = MyApp(css_path="column_span.tcss")
+if __name__ == "__main__":
+    app = MyApp()
+    app.run()

docs/examples/styles/content_align.py

@@ -3,10 +3,14 @@
 
 
 class ContentAlignApp(App):
+    CSS_PATH = "content_align.tcss"
+
     def compose(self):
         yield Label("With [i]content-align[/] you can...", id="box1")
         yield Label("...[b]Easily align content[/]...", id="box2")
         yield Label("...Horizontally [i]and[/] vertically!", id="box3")
 
 
-app = ContentAlignApp(css_path="content_align.tcss")
+if __name__ == "__main__":
+    app = ContentAlignApp()
+    app.run()

docs/examples/styles/content_align_all.py

@@ -3,6 +3,8 @@
 
 
 class AllContentAlignApp(App):
+    CSS_PATH = "content_align_all.tcss"
+
     def compose(self):
         yield Label("left top", id="left-top")
         yield Label("center top", id="center-top")
@@ -15,4 +17,6 @@ def compose(self):
         yield Label("right bottom", id="right-bottom")
 
 
-app = AllContentAlignApp(css_path="content_align_all.tcss")
+if __name__ == "__main__":
+    app = AllContentAlignApp()
+    app.run()

docs/examples/styles/display.py

@@ -3,10 +3,14 @@
 
 
 class DisplayApp(App):
+    CSS_PATH = "display.tcss"
+
     def compose(self):
         yield Static("Widget 1")
         yield Static("Widget 2", classes="remove")
         yield Static("Widget 3")
 
 
-app = DisplayApp(css_path="display.tcss")
+if __name__ == "__main__":
+    app = DisplayApp()
+    app.run()

docs/examples/styles/dock_all.py

@@ -4,6 +4,8 @@
 
 
 class DockAllApp(App):
+    CSS_PATH = "dock_all.tcss"
+
     def compose(self):
         yield Container(
             Container(Label("left"), id="left"),
@@ -14,4 +16,6 @@ def compose(self):
         )
 
 
-app = DockAllApp(css_path="dock_all.tcss")
+if __name__ == "__main__":
+    app = DockAllApp()
+    app.run()

docs/examples/styles/grid.py

@@ -3,6 +3,8 @@
 
 
 class GridApp(App):
+    CSS_PATH = "grid.tcss"
+
     def compose(self):
         yield Static("Grid cell 1\n\nrow-span: 3;\ncolumn-span: 2;", id="static1")
         yield Static("Grid cell 2", id="static2")
@@ -13,4 +15,6 @@ def compose(self):
         yield Static("Grid cell 7", id="static7")
 
 
-app = GridApp(css_path="grid.tcss")
+if __name__ == "__main__":
+    app = GridApp()
+    app.run()

docs/examples/styles/grid_columns.py

@@ -4,6 +4,8 @@
 
 
 class MyApp(App):
+    CSS_PATH = "grid_columns.tcss"
+
     def compose(self):
         yield Grid(
             Label("1fr"),
@@ -19,4 +21,6 @@ def compose(self):
         )
 
 
-app = MyApp(css_path="grid_columns.tcss")
+if __name__ == "__main__":
+    app = MyApp()
+    app.run()

docs/examples/styles/grid_gutter.py

@@ -4,6 +4,8 @@
 
 
 class MyApp(App):
+    CSS_PATH = "grid_gutter.tcss"
+
     def compose(self):
         yield Grid(
             Label("1"),
@@ -17,4 +19,6 @@ def compose(self):
         )
 
 
-app = MyApp(css_path="grid_gutter.tcss")
+if __name__ == "__main__":
+    app = MyApp()
+    app.run()

docs/examples/styles/grid_rows.py

@@ -4,6 +4,8 @@
 
 
 class MyApp(App):
+    CSS_PATH = "grid_rows.tcss"
+
     def compose(self):
         yield Grid(
             Label("1fr"),
@@ -19,4 +21,6 @@ def compose(self):
         )
 
 
-app = MyApp(css_path="grid_rows.tcss")
+if __name__ == "__main__":
+    app = MyApp()
+    app.run()

docs/examples/styles/grid_size_both.py

@@ -4,6 +4,8 @@
 
 
 class MyApp(App):
+    CSS_PATH = "grid_size_both.tcss"
+
     def compose(self):
         yield Grid(
             Label("1"),
@@ -14,4 +16,6 @@ def compose(self):
         )
 
 
-app = MyApp(css_path="grid_size_both.tcss")
+if __name__ == "__main__":
+    app = MyApp()
+    app.run()

docs/examples/styles/grid_size_columns.py

@@ -4,6 +4,8 @@
 
 
 class MyApp(App):
+    CSS_PATH = "grid_size_columns.tcss"
+
     def compose(self):
         yield Grid(
             Label("1"),
@@ -14,4 +16,6 @@ def compose(self):
         )
 
 
-app = MyApp(css_path="grid_size_columns.tcss")
+if __name__ == "__main__":
+    app = MyApp()
+    app.run()

docs/examples/styles/height.py

@@ -3,8 +3,12 @@
 
 
 class HeightApp(App):
+    CSS_PATH = "height.tcss"
+
     def compose(self):
         yield Widget()
 
 
-app = HeightApp(css_path="height.tcss")
+if __name__ == "__main__":
+    app = HeightApp()
+    app.run()