diff --git a/content/patterns/coding/code-blocks.md b/content/patterns/coding/code-blocks.md index bd2464c..7cc4fee 100644 --- a/content/patterns/coding/code-blocks.md +++ b/content/patterns/coding/code-blocks.md @@ -46,3 +46,7 @@ toggle.addEventListener('click', (e) => { e.target.setAttribute('aria-pressed', !pressed); }); {{}} + +{{% note %}} +To preserve the wrapping inside code blocks, horizontal scrolling is implemented. To make sure scrolling is keyboard accessible, code blocks are focusable. An `aria-label` is provided to identify the code block to screen reader users. +{{% /note %}} diff --git a/docs/patterns/coding/code-blocks/index.html b/docs/patterns/coding/code-blocks/index.html index e828e09..5632084 100644 --- a/docs/patterns/coding/code-blocks/index.html +++ b/docs/patterns/coding/code-blocks/index.html @@ -411,6 +411,17 @@ toggle.addEventListener('click', (e) => { + + +