Molecule widgets have sensible default css

diff --git a/src/obs_ctl/__init__.py b/src/obs_ctl/__init__.py
index 5aa63977a4c0ea95b3ce9d8328a2f79d4b276cf2..e01e7a684323cab5587a83fbc33f774e08d316a6 100644 (file)
--- a/src/obs_ctl/__init__.py
+++ b/src/obs_ctl/__init__.py
@@ -1,5 +1,7 @@
 from .app import OBSCtlApp
+from .widget_testbed import TestApp
 
 def run():
     app = OBSCtlApp()
+    # app = TestApp()
     app.run()
\ No newline at end of file

diff --git a/src/obs_ctl/app.py b/src/obs_ctl/app.py
index da20684c9131842e82d729c49e52d7390accbdeb..628f2ccade5d59bf0b66bc002981c7daa434210a 100644 (file)
--- a/src/obs_ctl/app.py
+++ b/src/obs_ctl/app.py
@@ -3,7 +3,7 @@ from logging import getLogger
 
 from textual import on
 from textual.app import App
-from textual.containers import HorizontalGroup, VerticalGroup
+from textual.containers import HorizontalGroup, VerticalGroup, ScrollableContainer
 from textual.widgets import Footer, Header
 
 # need to import log to initalize logging
@@ -23,11 +23,13 @@ class OBSCtlApp(App):
         yield Footer()
         yield obs.API(1, id="api")
         logger.debug("Composing OBSCtlApp")
-        with VerticalGroup(classes="content"):
-            with HorizontalGroup(id="top_block", classes="block"):
-                yield RecordControls(id="record_controls", classes="section")
-                yield SettingsBlock(id="settings_container", classes="section")
-            yield StatsDisplay(id="stats_display", classes="section")
+        with ScrollableContainer(classes="scrollbox"):
+            with VerticalGroup(classes="content"):
+                with HorizontalGroup(id="top_block", classes="block"):
+                    yield RecordControls(id="record_controls", classes="section")
+                    yield SettingsBlock(id="settings_container", classes="section")
+                with HorizontalGroup(id="bottom_block", classes="block"):
+                    yield StatsDisplay(id="stats_display", classes="section")
 
 
     @on(obs.API.Report, "#api")

diff --git a/src/obs_ctl/data/layout.tcss b/src/obs_ctl/data/layout.tcss
index 0e080c882d70a3637f5a2b20f4ff5a0e67b8e5da..74aa1474baaf00e91d2865e1da40a3f0308c7592 100644 (file)
--- a/src/obs_ctl/data/layout.tcss
+++ b/src/obs_ctl/data/layout.tcss
@@ -1,66 +1,64 @@
+# ------------
+# Color Blocks
+# (for arranging)
+# ------------
+# Screen {
+#     background:red;
+#     .scrollbox {
+#         background:green;
+#         .content {
+#             background:blue;
+#         }
+#     }
+# }
 # ------
 # Layout
 # ------
 Screen {
     overflow-x:auto;
-    .content { /** VerticalGroup */
-        /** Gets this small before being scrollable */
-        min-width:74;
-        min-height:20;
-        /** --------------------------------------- */
-        #top_block { /** HorizontalGroup */
-            min-height:10;
-            max-height:14;
-            RecordControls { /** RecordControls (ScrollableContainer) DEFAULT_CSS */
-                align:center middle;
-                min-width:24;
-                max-width:48;
-                .record_controls--content { /** Grid */
-                    height:10;
-                    min-width:36;
-                    grid-size:2;
-                    .bool_control--light{ /** RadioButton */
-                        width:16;
-                        text-align:center;
+    .scrollbox { /** ScrollableContainer */
+        align:center middle;
+        min-width:52;
+        min-height:15;
+        .content { /** VerticalGroup */
+            /** Gets this small before being scrollable */
+            min-width:74;
+            max-width:160;
+            min-height:20;
+            max-height:43;
+            /** --------------------------------------- */
+            #top_block { /** HorizontalGroup */
+                min-height:11;
+                height:11fr;
+                RecordControls { /** Scrollable Container OVERRIDDEN */
+                    min-width:24;
+                    max-width:60;
+                    min-height:6;
+                    .record_controls--content { /** Grid */
+                        min-width:36;
+                        height:10;
                     }
                 }
-            }
-            SettingsBlock { /** Container */
-                min-width:50;
-                .obs_settings_pane--content {
-                    grid-size:2 1;
-                    grid-columns:16 1fr;
-                    min-width:36;
+                SettingsBlock { /** Container */
+                    min-width:50;
+                    .obs_settings_pane--content {
+                        grid-size:2 1;
+                        grid-columns:16 1fr;
+                        min-width:36;
+                    }
                 }
             }
-        }
-        
-        StatsDisplay { /** StatsDisplay (ScrollableContainer) DEFAULT_CSS */
-            align:left middle;
-            min-height:9;
-            max-height:18;
-            min-width:33;
-            .stats_display--content { /** Grid */
-                grid-size:12;
-                min-height:8;
-                max-height:12;
-                min-width:75;
-                max-width:100;
-                .stats_display--top { /** TextReadout */
-                    column-span:3;
-                }
-                .stats_display--bottom { /** TextReadout */
-                    column-span:4;
-                }
-                TextReadout { /** Container */
-                    .text_readout--readout { /** Label (both) */
-                        align-horizontal:center;
-                    }
-                    .text_readout--label { /** Label (top) */
-                        align-vertical:bottom;
+            #bottom_block{
+                min-width:33;
+                min-height:9;
+                height:9fr;
+                StatsDisplay { /** StatsDisplay (ScrollableContainer) OVERRIDDEN */
+                    .stats_display--content { /** Grid */
+                        min-width:75;
+                        min-height:8;
+                        max-height:12;
                     }
                 }
-        
             }
         }
     }

diff --git a/src/obs_ctl/interface/element/bool_control.py b/src/obs_ctl/interface/element/bool_control.py
index 97d2dc58c36d68c4e67d32320157d3aa11fbbec0..175958e1f0d3cd885cc04da70b0050385ad6f856 100644 (file)
--- a/src/obs_ctl/interface/element/bool_control.py
+++ b/src/obs_ctl/interface/element/bool_control.py
@@ -40,6 +40,12 @@ class BoolControl(containers.Container):
         bool_control--lightbox (Center)
         bool_control--buttonbox (Center)
     """
+    DEFAULT_CSS = """
+        RadioButton {
+            min-width:16 !important;
+            text-align:center !important;
+        }
+    """
     COMPONENT_CLASSES = {
         "bool_control--light",
         "bool_control--true_button",

diff --git a/src/obs_ctl/interface/molecule/record_controls.py b/src/obs_ctl/interface/molecule/record_controls.py
index 71333c00198d3effb72a242645ba1e9557b03947..4a1e96c6c885222e3fbfdfefc2649282616ef475 100644 (file)
--- a/src/obs_ctl/interface/molecule/record_controls.py
+++ b/src/obs_ctl/interface/molecule/record_controls.py
@@ -36,7 +36,24 @@ class RecordControls(ScrollableContainer):
             record_controls--stream_control (BoolControl)
             record_controls--pause_control (BoolControl)
     """
-
+    DEFAULT_CSS = """
+    RecordControls { /** RecordControls (ScrollableContainer) DEFAULT_CSS */
+        align:center middle;
+        min-width:17;
+        min-height:4;
+        .record_controls--content { /** Grid */
+            min-width:32;
+            height:6;
+            grid-size:2;
+            .bool_control--light{ /** RadioButton */
+                width:1fr;
+            }
+            .bool_control--buttons{
+                width:1fr;
+            }
+        }
+    }
+    """
     COMPONENT_CLASSES = {
         "record_controls--control",
         "record_controls--output_control",

diff --git a/src/obs_ctl/interface/molecule/stats_display.py b/src/obs_ctl/interface/molecule/stats_display.py
index 9efb571a7c73e73a1bb61d8d84a651ffdf5a8c28..2037bad65865c4d233e562bd0bf6f2cf704d74cc 100644 (file)
--- a/src/obs_ctl/interface/molecule/stats_display.py
+++ b/src/obs_ctl/interface/molecule/stats_display.py
@@ -17,7 +17,33 @@ class StatsDisplay(ScrollableContainer):
     stats_display--dropped_ren
     stats_display--dropped_enc
     """
+    DEFAULT_CSS = """
+    StatsDisplay { /** StatsDisplay (ScrollableContainer) DEFAULT_CSS */
+        align:center middle;
+        .stats_display--content { /** Grid */
+            grid-size:12;
+            min-width:66;
+            max-width:120;
+            min-height:4;
+            max-height:8;
+            .stats_display--top { /** TextReadout */
+                column-span:3;
+            }
+            .stats_display--bottom { /** TextReadout */
+                column-span:4;
+            }
+            TextReadout { /** Container */
+                .text_readout--readout { /** Label (both) */
+                    align-horizontal:center;
+                }
+                .text_readout--label { /** Label (top) */
+                    align-vertical:bottom;
+                }
+            }
 
+        }
+    }
+    """
     COMPONENT_CLASSES = {
         "stats_display--cpu",
         "stats_display--ram",