Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Implement UsaBanner component #8

Closed
4 tasks done
patrickcate opened this issue Oct 30, 2021 · 0 comments
Closed
4 tasks done

Implement UsaBanner component #8

patrickcate opened this issue Oct 30, 2021 · 0 comments
Assignees
@patrickcate
Labels
feature New feature or request

Comments

@patrickcate
Copy link
Owner

patrickcate commented Oct 30, 2021 •
edited
Loading

Banner

The banner identifies official websites of government organizations in the United States.

Props

Name Type Default Required Options
open Boolean false false n/a
domain String 'gov' false n/a
id String auto-generated false n/a
aria-label String 'Official government website' false n/a

Slots

  • default
  • flag
  • aria-label

CSS Classes

  • open: usa-banner__header--expanded

External Libraries

  • None

Sub-Components

Dependencies

  • useToggle
  • uniqueId

Notes

  • The default content for slots should be the standard english language text.

Tests

  1. If a id prop is not provided, a unique id is auto-generated.
  2. When the banner is open, the CSS class usa-banner__header--expanded is applied.
  3. When the aria-label prop is used, the text is added as the aria-label slot content.
  4. When the aria-label slot is used, the content is added as the aria-label slot content.
  5. When the aria-label prop and slot are both used, the he aria-label slot content will override the aria-label prop.
@patrickcate patrickcate changed the title Implement Banner component Implement Banner component Oct 30, 2021
@patrickcate patrickcate changed the title Implement Banner component Implement UsaBanner component Oct 30, 2021
@patrickcate patrickcate added the feature New feature or request label Nov 11, 2021
@patrickcate patrickcate self-assigned this Dec 22, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@patrickcate patrickcate

Labels
feature New feature or request
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@patrickcate