Name Description Size
moz-card.css Bug 1791816, 1839523: replace with spacing tokens 4770
moz-card.mjs Cards contain content and actions about a single subject. There are two card types: The default type where no type attribute is required and the card will have no extra functionality. The "accordion" type will initially not show any content. The card will contain an arrow to expand the card so that all of the content is visible. @property {string} heading - The heading text that will be used for the card. @property {string} icon - (optional) A flag to indicate the header should include an icon @property {string} type - (optional) The type of card. No type specified will be the default card. The other available type is "accordion" @slot content - The content to show inside of the card. 3312
moz-card.stories.mjs The accordion card can be expanded either by the chevron icon button or by activating the details element. Mouse users can click on the chevron button or the details element, while keyboard users can tab to the details element and have a focus ring around the details element in the card. Additionally, the details element is announced as a button so I don't believe we are providing a degraded experience to non-mouse users. Bug 1854008: We should probably make the accordion button a clickable div or something that isn't announced to screen readers. 3285