Merge branch 'css' of github.com:Textualize/textual into docs-animator

docs/examples/guide/screens/modal01.css

@@ -0,0 +1,16 @@
+#dialog {
+    grid-size: 2;
+    grid-gutter: 1 2;
+    margin: 1 2;
+}
+
+#question {
+    column-span: 2;
+    content-align: center bottom;
+    width: 100%;
+    height: 100%;
+}
+
+Button {
+    width: 100%;
+}

docs/examples/guide/screens/modal01.py

@@ -0,0 +1,37 @@
+from textual.app import App, ComposeResult
+from textual.containers import Grid
+from textual.screen import Screen
+from textual.widgets import Static, Header, Footer, Button
+
+
+class QuitScreen(Screen):
+    def compose(self) -> ComposeResult:
+        yield Grid(
+            Static("Are you sure you want to quit?", id="question"),
+            Button("Quit", variant="error", id="quit"),
+            Button("Cancel", variant="primary", id="cancel"),
+            id="dialog",
+        )
+
+    def on_button_pressed(self, event: Button.Pressed) -> None:
+        if event.button.id == "quit":
+            self.app.exit()
+        else:
+            self.app.pop_screen()
+
+
+class ModalApp(App):
+    CSS_PATH = "modal01.css"
+    BINDINGS = [("q", "request_quit", "Quit")]
+
+    def compose(self) -> ComposeResult:
+        yield Header()
+        yield Footer()
+
+    def action_request_quit(self) -> None:
+        self.push_screen(QuitScreen())
+
+
+if __name__ == "__main__":
+    app = ModalApp()
+    app.run()

docs/examples/guide/screens/screen01.css

@@ -0,0 +1,18 @@
+BSOD {
+    align: center middle;
+    background: blue;
+    color: white;
+}
+
+BSOD>Static {
+    width: 70;    
+}
+
+#title {
+    content-align-horizontal: center;
+    text-style: reverse;
+}
+
+#any-key {
+    content-align-horizontal: center;
+}

docs/examples/guide/screens/screen01.py

@@ -0,0 +1,34 @@
+from textual.app import App, Screen, ComposeResult
+from textual.widgets import Static
+
+
+ERROR_TEXT = """
+An error has occurred. To continue:
+
+Press Enter to return to Windows, or
+
+Press CTRL+ALT+DEL to restart your computer. If you do this,
+you will lose any unsaved information in all open applications.
+
+Error: 0E : 016F : BFF9B3D4
+"""
+
+
+class BSOD(Screen):
+    BINDINGS = [("escape", "app.pop_screen", "Pop screen")]
+
+    def compose(self) -> ComposeResult:
+        yield Static(" Windows ", id="title")
+        yield Static(ERROR_TEXT)
+        yield Static("Press any key to continue [blink]_[/]", id="any-key")
+
+
+class BSODApp(App):
+    CSS_PATH = "screen01.css"
+    SCREENS = {"bsod": BSOD()}
+    BINDINGS = [("b", "push_screen('bsod')", "BSOD")]
+
+
+if __name__ == "__main__":
+    app = BSODApp()
+    app.run()

docs/examples/guide/screens/screen02.css

@@ -0,0 +1,18 @@
+BSOD {
+    align: center middle;
+    background: blue;
+    color: white;
+}
+
+BSOD>Static {
+    width: 70;    
+}
+
+#title {
+    content-align-horizontal: center;
+    text-style: reverse;
+}
+
+#any-key {
+    content-align-horizontal: center;
+}

docs/examples/guide/screens/screen02.py

@@ -0,0 +1,36 @@
+from textual.app import App, Screen, ComposeResult
+from textual.widgets import Static
+
+
+ERROR_TEXT = """
+An error has occurred. To continue:
+
+Press Enter to return to Windows, or
+
+Press CTRL+ALT+DEL to restart your computer. If you do this,
+you will lose any unsaved information in all open applications.
+
+Error: 0E : 016F : BFF9B3D4
+"""
+
+
+class BSOD(Screen):
+    BINDINGS = [("escape", "app.pop_screen", "Pop screen")]
+
+    def compose(self) -> ComposeResult:
+        yield Static(" Windows ", id="title")
+        yield Static(ERROR_TEXT)
+        yield Static("Press any key to continue [blink]_[/]", id="any-key")
+
+
+class BSODApp(App):
+    CSS_PATH = "screen02.css"
+    BINDINGS = [("b", "push_screen('bsod')", "BSOD")]
+
+    def on_mount(self) -> None:
+        self.install_screen(BSOD(), name="bsod")
+
+
+if __name__ == "__main__":
+    app = BSODApp()
+    app.run()