Toggle button style

CHANGELOG.md

@@ -5,6 +5,13 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/)
 and this project adheres to [Semantic Versioning](http://semver.org/).
 
+## [6.10.0] - 2025-12-15
+
+### Fixed
+
+- Fixed broken thems
+- Updated toggle button style for consistancy
+
 ## [6.9.0] - 2025-12-14
 
 ### Added

src/textual/theme.py

@@ -323,9 +323,9 @@ def to_color_system(self) -> ColorSystem:
             "border": "#524f67",
             "border-blurred": "#6e6a86",
             "footer-background": "#26233a",
-            "block-cursor-foreground": "#f4ede8",
+            "block-cursor-foreground": "#191724",
             "block-cursor-text-style": "none",
-            "button-color-background": "#403d52",
+            "block-cursor-background": "#c4a7e7",
         },
     ),
     "rose-pine-moon": Theme(
@@ -347,9 +347,9 @@ def to_color_system(self) -> ColorSystem:
             "border": "#56526e",
             "border-blurred": "#6e6a86",
             "footer-background": "#393552",
-            "block-cursor-foreground": "#f4ede8",
+            "block-cursor-foreground": "#232136",
             "block-cursor-text-style": "none",
-            "button-color-background": "#44415a",
+            "block-cursor-background": "#c4a7e7",
         },
     ),
     "rose-pine-dawn": Theme(
@@ -371,9 +371,9 @@ def to_color_system(self) -> ColorSystem:
             "border": "#cecacd",
             "border-blurred": "#9893a5",
             "footer-background": "#f2e9e1",
-            "block-cursor-foreground": "#cecacd",
+            "block-cursor-foreground": "#faf4ed",
             "block-cursor-text-style": "none",
-            "button-color-background": "#575279",
+            "block-cursor-background": "#575279",
         },
     ),
 }

src/textual/widgets/_radio_set.py

@@ -50,27 +50,34 @@ class RadioSet(VerticalScroll, can_focus=True, can_focus_children=False):
             & > .toggle--button {
                 color: $panel-darken-2;
                 background: $panel;
-            }
-
-            &.-selected {
-                background: $block-cursor-blurred-background;
-            }
+            }            
         }
 
         & > RadioButton.-on .toggle--button {
             color: $text-success;
         }
 
+        &:blur {
+            & > RadioButton.-selected {
+                & > .toggle--label {
+                    background: $block-cursor-blurred-background;
+                }
+            }
+        }
+
         &:focus {
             /* The following rules/styles mimic similar ToggleButton:focus rules in
             * ToggleButton. If those styles ever get updated, these should be too.
             */
             border: tall $border;
             background-tint: $foreground 5%;
             & > RadioButton.-selected {
-                color: $block-cursor-foreground;
-                text-style: $block-cursor-text-style;
-                background: $block-cursor-background;
+
+                & > .toggle--label {
+                    background: $block-cursor-background;                
+                    color: $block-cursor-foreground;                
+                    text-style: $block-cursor-text-style;
+                }                         
             }
 
         }

src/textual/widgets/_toggle_button.py

@@ -85,11 +85,14 @@ class ToggleButton(Static, can_focus=True):
             background: $panel;
         }
 
-        &:focus {
-            border: tall $border;
-            background-tint: $foreground 5%;
-            & > .toggle--label {
-                color: $block-cursor-foreground;                
+        &:focus {       
+            border: tall $border;            
+            background-tint: $foreground 5%;     
+
+            & > .toggle--label {                         
+                color: $block-cursor-foreground;
+                background: $block-cursor-background;       
+                text-style: $block-cursor-text-style;                
             }
         }
         &:blur:hover {
@@ -160,7 +163,7 @@ def _make_label(self, label: ContentText) -> Content:
         Returns:
             A `Content` rendering of the label for use in the button.
         """
-        label = Content.from_text(label).first_line
+        label = Content.from_text(label).first_line.rstrip()
         return label
 
     @property
@@ -202,19 +205,18 @@ def render(self) -> Content:
         """
         button = self._button
         label_style = self.get_visual_style("toggle--label")
-        label = self._label.stylize_before(label_style)
-        spacer = " " if label else ""
+        label = self._label.pad(1, 1).stylize_before(label_style)
 
         if self._button_first:
-            content = Content.assemble(button, spacer, label)
+            content = Content.assemble(button, label)
         else:
-            content = Content.assemble(label, spacer, button)
+            content = Content.assemble(label, button)
         return content
 
     def get_content_width(self, container: Size, viewport: Size) -> int:
         return (
             self._button.get_optimal_width(self.styles, 0)
-            + (1 if self._label else 0)
+            + (2 if self._label else 0)
             + self._label.get_optimal_width(self.styles, 0)
         )