Skip to content

AisButtonBar ​

AisButtonBar is a specialized AisFlexBar that provides a flexible and responsive container for buttons and other controls. Its primary purpose is to organize form submit buttons. AisButtonBar has no outward presentation, instead it spaces and arranges its contents.

The button bar is an AisFlexBar that provides three slots. Each slot is wrapped in an AisFlexBar and the three bars are set spread out evenly across the screen. Children in each slot will maintain a consistent gap and wrap as necessary. In a mobile view each child becomes full-width. Adjust the size of your screen to see how the example button bars respond.

Slots ​

default ​

AisButtonBar's default slot exposes a flex context that will space out the component's contents from the left-hand side of the screen. The slots children are full-width in the mobile layout and will wrap as necessary as the screen changes.

secondary ​

The secondary slot exposes a flex context that pulls to the right side of the screen. Note how the Review button pulls to the right below. The secondary slot attempts to maintain a visual separation both in the mobile layout and when the contexts wrap.

tertiary ​

The tertiary slot exposes a third flex context. When provided, it will push the secondary slot to the middle of the bar.