Toolbar

Toolbar is a group of buttons or icons put together to have multiple actionable items in a place.

Variants

A total of four different toolbars are available in GEL.

Demo

Guidance

• Toolbar are in genaral floated towards the right of the infographic/charts and tables.
• All icons should be accompanied with a tooltip.
• There can be multiple toolbars exisiting together with different functionalities.
• Additional actionable items/icon that are less important can be hidden under the ellipse sign.
• The gap between control-buttons on the same line is spacer-2.

When to use

• Toolbar are uesd to add more actionable content to a given chart/infographic.

Designer assets

figma

Hey Designers, please find the Figma assets here. If you want permission to access the file, please contact Experience Design CoP.

Developer API

vue

Hey Developers, find out the tech documentation of this compoment on PrimeVue. If you have issue, please contact Development CoP