Skip to main content

Design system components

ReliablePartnerBadge

Vastuu Group "Luotettava Kumppani" trust mark, language-matched, linking to the corresponding Reliable Partner report PDF.

Status: alpha. Group: marketing. Markdown version: /design-system/components/reliable-partner-badge.md

When to use

Trust mark for the Vastuu Group Reliable Partner certification: small in the site footer, medium or large beside pricing and About copy where the certification supports a claim.

When not to use

The contract records no forbidden uses.

Look-alikes

The contract names no look-alike with a deciding condition.

Props

ReliablePartnerBadge props
PropTypeDefaultDescriptionRequired
size"sm" | "md" | "lg"mdBadge height: sm 32px (footer), md 48px, lg 64px.No
hrefstring | nullnoneLink target. Omit for the language-matched Reliable Partner report PDF; pass null to render unlinked.No
classNamestringnoneAdditional class name applied to the badge root.No

Variants

  • Available sizes: sm, md, lg (default md).

Invalid combinations

The contract records no invalid combinations.

Keyboard

ReliablePartnerBadge keyboard behaviour
KeyBehaviour
TabMoves focus to the badge link.
EnterActivates it (native anchor).

Rules

Every item under When not to use is a MUST NOT. MUST and SHOULD follow RFC 2119.

ReliablePartnerBadge rules
LevelRuleHow it is checked
MUSTARIA: The badge image carries a translated alt describing the certification, never an empty alt, because the link has no other accessible name.Not yet verified: no evidence record. WCAG 4.1.2.
MUSTARIA: The link opens a PDF in a new tab and says so in its title/alt so the context change is not a surprise.Not yet verified: no evidence record. WCAG 4.1.2.
MUSTARIA: When rendered unlinked (href={null}) the alt still carries the meaning.Not yet verified: no evidence record. WCAG 4.1.2.
MUSTRequired stories produce no axe violations at the configured severity.Automated by npm run test:stories:matrix:ci. WCAG 2.5.8.
MUSTThe accessibility tree (role, name, state) matches the committed snapshot for every required story.Automated by npm run test:stories:matrix:ci. WCAG 1.3.1, 4.1.2.
MUSTThe component remains legible and operable under a real browser forced-colors: active pass.Automated by npm run test:stories:hc.
MUSTEvery documented keyboard interaction works as specified.Not yet verified: no evidence record. WCAG 2.1.1, 2.1.2.
MUSTA human completed an end-to-end accessibility review of this component.Not yet verified: no evidence record.

Install and import

  • In-repo only. ReliablePartnerBadge is not exported from @digitaltableteur/react, so there is no public import path.
  • Alpha components are internal and never exported.