Overview
An alternative to the Button Group or Select field types that is a bit more compact and visually appealing.
Data structure
The selected value is stored as an integer.
image_width: 50Templating
Use in your front end, most likely with a CSS framework like Tailwind or Bootstrap to set custom widths.
<div class="col-12""> <div class="w-25"> <h1>Compact headings</h1> </div> <div class="w-{{ image_width }}"> <h2>With wider sub-headings</h2> </div></div><div class="header-block"> <img class="w-[{{ $image_width }}px] src="/assets/mycoolicon.png> <h1>Icon overview</h1></div>Options
options
array
The array of integers presented in the blueprint. Default: 25 / 33 / 50 / 66 / 75 / 100
default
integer
The default selected width. Can be set to a value that doesn't exist in the options array if desired.
