Button group
Button groups consist of related Buttons, a group of actions related to one task.
| Last update: | () |
| Message | feat(buttongroup): baseline for different height buttons |
| Committer: | dkocsis |
| Version history | |
Default
<div class="e-buttongroup">
<button type="reset" class="e-btn">
Default
</button>
<button type="submit" class="e-btn e-btn-secondary">
Secondary
</button>
<button type="submit" class="e-btn e-btn-primary">
Primary
</button>
</div>
<div class="e-buttongroup">
<button type="reset" class="e-btn">Default</button>
<button type="submit" class="e-btn e-btn-secondary">Secondary</button>
<button type="submit" class="e-btn e-btn-primary">Primary</button>
</div>Variations
Sticky
<div class="e-buttongroup e-buttongroup-sticky">
<button type="reset" class="e-btn">
Default
</button>
<button type="submit" class="e-btn e-btn-secondary">
Secondary
</button>
<button type="submit" class="e-btn e-btn-primary">
Primary
</button>
</div>
<div class="e-buttongroup e-buttongroup-sticky">
<button type="reset" class="e-btn">Default</button>
<button type="submit" class="e-btn e-btn-secondary">Secondary</button>
<button type="submit" class="e-btn e-btn-primary">Primary</button>
</div>Flexbox
<div class="e-buttongroup e-buttongroup-flex">
<button type="submit" class="e-btn e-btn-primary">
Primary button
</button>
<button type="submit" class="e-btn e-btn-secondary">
Secondary
</button>
<button type="submit" class="e-btn">
Secondary
</button>
<button type="submit" class="e-btn">
Secondary
</button>
<button type="submit" class="e-btn">
Secondary
</button>
<button type="reset" class="e-btn">
Default button
</button>
</div>
<div class="e-buttongroup e-buttongroup-flex">
<button type="submit" class="e-btn e-btn-primary">Primary button</button>
<button type="submit" class="e-btn e-btn-secondary">Secondary</button>
<button type="submit" class="e-btn">Secondary</button>
<button type="submit" class="e-btn">Secondary</button>
<button type="submit" class="e-btn">Secondary</button>
<button type="reset" class="e-btn">Default button</button>
</div>