DSO Component Library

Button: Primary button with badge 

<button type="button" class="btn btn-default">
    Versturen
    <span class="badge">3</span>
</button>
 
<button type="{{ type }}" class="btn btn-{{ modifier }}" {{{ifattr 'disabled' disabled }}}>
  {{#if icon }}
    {{> '@icon' icon=icon }}
  {{/if}}
  {{#if iconOnly }}
    <span class="sr-only">{{ label }}</span>
  {{else}}
    {{ label }}
  {{/if}}
  {{#if count }}
    {{> '@badge' }}
  {{/if}}
</button>
 
label: Versturen
type: button
modifier: default
count: 3

There are no notes for this item.

WARNING: WCAG2AA.Principle1.Guideline1_4.1_4_3.G18.BgImage

This element's text is placed on a background image. Ensure the contrast ratio between the text and all covered parts of the image are at least 4.5:1.

<button type="button" class="btn btn-default"> Versturen </button>

NOTICE: WCAG2AA.Principle2.Guideline2_4.2_4_2.H25.2

Check that the title element describes the document.

<title>Button

NOTICE: WCAG2AA.Principle3.Guideline3_2.3_2_1.G107

Check that a change of context does not occur when this input field receives focus.

<button type="button" class="btn btn-default"> Versturen </button>