Skip to content

Switch to use the hidden attribute instead of the --hidden class #1890

@frankieroberto

Description

@frankieroberto

We have a few usages of a --hidden modifier class, which might be set and unset using JavaScript, eg for conditional Checkboxes and Radios.

These could be replaced with a hidden attribute instead. No huge advantage of doing so, but it saves a bit of CSS and avoids having 2 ways to do the same thing.

See https://html.spec.whatwg.org/multipage/interaction.html#attr-hidden-hidden-state

We also use it for the Tabs component, although perhaps that ought not to use hidden as the HTML spec says:

The hidden attribute must not be used to hide content that could legitimately be shown in another presentation. For example, it is incorrect to use hidden to hide panels in a tabbed dialog, because the tabbed interface is merely a kind of overflow presentation — one could equally well just show all the form controls in one big page with a scrollbar. It is similarly incorrect to use this attribute to hide content just from one presentation — if something is marked hidden, it is hidden from all presentations, including, for instance, screen readers.

See also #1889

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions