btn-groups.md

Redundancy when using button groups

Let's say you want to mark a group of buttons as compactable. Instead of simpyl writing:

<div class="fd-button-group fd-is-compactable" role="group" aria-label="Group label">
  <button class="fd-button" aria-pressed="true">Left</button>
  <button class="fd-button">Middle</button>
  <button class="fd-button">Right</button>
</div>

one has to write:

<div class="fd-button-group" role="group" aria-label="Group label">
  <button class="fd-button fd-button--compact" aria-pressed="true">Left</button>
  <button class="fd-button fd-button--compact">Middle</button>
  <button class="fd-button fd-button--compact">Right</button>
</div>

Again: This is possible but leads to dirty code in the case of Vue.