button bar alt styles

haxeui · Oct 8, 2024 · 4411383 · 4411383
1 parent a094608
commit 4411383
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 0 deletions.
diff --git a/haxe/ui/_module/styles/default/buttons.css b/haxe/ui/_module/styles/default/buttons.css
@@ -72,6 +72,10 @@ WIP - dunno what looks "right"
     spacing: 0;
 }
 
+.button-bar .button-bar-divider {
+    hidden: true;
+}
+
 .button-bar .button {
     border-radius: 0;
     border: $normal-border-size solid $normal-border-color;
@@ -113,6 +117,40 @@ WIP - dunno what looks "right"
     border-bottom-right-radius: $normal-border-radius;
 }
 
+/************************************************************************
+** BUTTON BAR - ALT STYLES - PILL BUTTONS
+*************************************************************************/
+.button-bar.pill-buttons {
+    padding: 5px;
+    background-color: $solid-background-color-down;
+    border-radius: 5px;
+    spacing: 5px;
+}
+
+.button-bar.pill-buttons .button-bar-divider {
+    hidden: false;
+    height: 80%;
+    width: 1px;
+    background-color: $normal-border-color;
+    vertical-align: center;
+}
+
+.button-bar.pill-buttons .button, .button-bar.pill-buttons .button.first, .button-bar.pill-buttons .button.last {
+    border: none;
+    background-color: none;
+    filter: none;
+    border-radius: 5px;
+    border-top-left-radius: 5px;
+    border-top-right-radius: 5px;
+    border-bottom-left-radius: 5px;
+    border-bottom-right-radius: 5px;
+}
+
+.button-bar.pill-buttons .button:down {
+    background-color: $selection-background-color;
+    color: $selection-text-color;
+}
+
 /************************************************************************
 ** BUTTON BAR - LEFT MENU ALTERNATE
 *************************************************************************/

diff --git a/haxe/ui/containers/ButtonBar.hx b/haxe/ui/containers/ButtonBar.hx
@@ -150,6 +150,13 @@ class ButtonBarBuilder extends CompositeBuilder {
 
     public override function addComponent(child:Component):Component {
         if ((child is Button)) {
+            if (_bar.numComponents > 0) {
+                var divider = new Component();
+                divider.addClass("button-bar-divider");
+                divider.scriptAccess = false;
+                _bar.addComponent(divider);
+
+            }
             if (_bar.selectedIndex == _bar.numComponents) {
                 cast(child, Button).selected = true;
             }