docs(sbb-mini-button-group): improve a11y examples

sbb-design-systems · Jul 24, 2024 · e0e5355 · e0e5355
1 parent e3847d2
commit e0e5355
Showing 1 changed file with 8 additions and 4 deletions.
diff --git a/src/elements/mini-button-group/readme.md b/src/elements/mini-button-group/readme.md
@@ -1,11 +1,11 @@
 The `sbb-mini-button-group` component displays a set of [sbb-mini-button](/docs/elements-sbb-button-sbb-mini-button--docs) optionally separated by a [sbb-divider](/docs/elements-sbb-divider--docs).
 
 ```html
-<sbb-mini-button-group>
-  <sbb-mini-button icon-name="..."></sbb-mini-button>
-  <sbb-mini-button icon-name="..."></sbb-mini-button>
+<sbb-mini-button-group accessibility-label="...">
+  <sbb-mini-button icon-name="..." aria-label="..."></sbb-mini-button>
+  <sbb-mini-button icon-name="..." aria-label="..."></sbb-mini-button>
   <sbb-divider orientation="vertical"></sbb-divider>
-  <sbb-mini-button icon-name="..."></sbb-mini-button>
+  <sbb-mini-button icon-name="..." aria-label="..."></sbb-mini-button>
 </sbb-mini-button-group>
 ```
 
@@ -19,6 +19,10 @@ There are four available sizes: `s`, `m` (default), `l` and `xl`.
 <sbb-mini-button-group negative size="l"> ... </sbb-mini-button-group>
 ```
 
+## Accessibility
+
+Use the `accessibility-label` property to describe the purpose of the `sbb-mini-button-group` for screen-reader users.
+
 <!-- Auto Generated Below -->
 
 ## Properties