add MessageScreen back and tweak/enhance screen layouts

this will be used for a help screen, which isn't done yet, but this
makes the edit screen incrementally better too

Signed-off-by: Brian S. Stephan <bss@incorporeal.org>

gp2040ce_bintools/config_tree.css

@@ -5,12 +5,12 @@ Tree {
 Button {
     border: round gray;
     content-align: center middle;
-    width: 100%;
+    max-width: 50%;
     height: 100%;
     margin: 0 1;
 }
 
-EditScreen {
+EditScreen, MessageScreen {
     align: center middle;
 }
 
@@ -31,14 +31,25 @@ EditScreen Label {
 }
 
 #edit-dialog {
-    grid-size: 2;
-    grid-rows: 1fr 3fr 1fr 2fr;
     padding: 0 1;
+    grid-rows: 1fr 1fr 1fr 1fr;
     width: 50%;
     height: 50%;
     border: tall gray 100%;
 }
 
+#message-dialog {
+    padding: 0 1;
+    grid-rows: 3fr 1fr;
+    width: 50%;
+    height: 50%;
+    border: tall gray 100%;
+}
+
+#button-container {
+    align: right middle;
+}
+
 #field-name, #field-input, #input-errors {
     column-span: 2;
 }

gp2040ce_bintools/gui.py

@@ -12,14 +12,14 @@ from rich.highlighter import ReprHighlighter
 from rich.text import Text
 from textual import on
 from textual.app import App, ComposeResult
-from textual.containers import Grid
+from textual.containers import Container, Grid, Horizontal
 from textual.logging import TextualHandler
 from textual.screen import ModalScreen
 from textual.validation import Number
 from textual.widgets import Button, Footer, Header, Input, Label, Pretty, Select, Tree
 from textual.widgets.tree import TreeNode
 
-from gp2040ce_bintools import core_parser, handler, _version
+from gp2040ce_bintools import _version, core_parser, handler
 from gp2040ce_bintools.builder import write_new_config_to_filename, write_new_config_to_usb
 from gp2040ce_bintools.rp2040 import get_bootsel_endpoints, read
 from gp2040ce_bintools.storage import (STORAGE_SIZE, USER_CONFIG_BOOTSEL_ADDRESS, ConfigReadError, get_config,
@@ -57,11 +57,12 @@ class EditScreen(ModalScreen):
             # we don't handle whatever these are yet
             self.input_field = Label(repr(self.field_value), id='field-input')
         yield Grid(
-            Label(self.field_descriptor.full_name, id="field-name"),
+            Container(Label(self.field_descriptor.full_name, id="field-name"), id="field-name-container"),
-            self.input_field,
+            Container(self.input_field, id="input-field-container"),
-            Pretty('', id='input-errors', classes='hidden'),
+            Container(Pretty('', id='input-errors', classes='hidden'), id="error-container"),
-            Button("Confirm", id='confirm-button'),
+            Horizontal(Button("Confirm", id='confirm-button'),
-            Button("Cancel", id='cancel-button'),
+                       Button("Cancel", id='cancel-button'),
+                       id="button-container"),
             id='edit-dialog',
         )
 
@@ -102,6 +103,27 @@ class EditScreen(ModalScreen):
             self.node.set_label(pb_field_to_node_label(self.field_descriptor, field_value))
 
 
+class MessageScreen(ModalScreen):
+    """Simple screen for displaying messages."""
+
+    def __init__(self, text: str, *args, **kwargs):
+        """Store the message for later display."""
+        self.text = text
+        super().__init__(*args, **kwargs)
+
+    def compose(self) -> ComposeResult:
+        """Build the pop-up window with the desired message displayed."""
+        yield Grid(
+            Container(Label(self.text, id="message-text"), id="text-container"),
+            Container(Button("OK", id='ok-button'), id="button-container"),
+            id='message-dialog',
+        )
+
+    def on_button_pressed(self, event: Button.Pressed) -> None:
+        """Process the button action (close the window)."""
+        self.app.pop_screen()
+
+
 class ConfigEditor(App):
     """Display the GP2040-CE configuration as a tree."""