User Story

1. As an end user, I want the toolbar buttons to adaptively display both icons and labels when there is sufficient screen width, and to automatically hide the labels, showing only icons when the screen width is limited. This will ensure that the toolbar remains functional and uncluttered, enhancing my user experience regardless of device or display size.

Acceptance Criteria

1. Dual Display Mode: When the screen width is adequate, ea toolbar-responsive.zul ch toolbar button should display both its icon and label.
2. Icon-Only Mode: As the screen width decreases to a specified threshold, the toolbar buttons should automatically transition to display only their icons, hiding the labels to save space.
3. Responsiveness: The transition between the dual display mode and icon-only mode should be smooth, without requiring a page reload.
4. User Interface Consistency: The toolbar should maintain a consistent height and alignment during and after the transition between display modes.

Details

1. Currently, it produces a multi-line toolbar.
2. provide a new mold for this, so app devs can choose.