Skip to content

[Table]: use core's shared sr-only helper #704

Description

@ly-tempel-bitweb

Problem

table.component.scss:680 defines .tedi-table__sr-only, a private copy of core's screen-reader-only
helper, used twice in table.component.html (lines 10 and 146). It is identical to core's
.screen-reader-only, .visually-hidden, .sr-only declaration for declaration.

The copy exists because core's helper shipped an invalid clip-path: rect(0, 0, 0, 0) — the comma
syntax belongs to the legacy clip property, so browsers dropped the declaration and nothing was
clipped. Fixed in TEDI-Design-System/core#155 and released in @tedi-design-system/core 6.11.1.

With core fixed the copy is redundant, and it will drift: core's helper also carries a
.focusable:active / :focus reset that un-hides skip-link-style elements on focus. The table's copy
does not, so that behaviour — and any future change to the helper — never reaches the table.

Solution

  • Replace both usages in table.component.html (lines 10, 146) with sr-only
  • Delete the .tedi-table__sr-only block from table.component.scss

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

tedi-readyTEDI-Ready component issue

Type

Projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions