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.

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

Implement tag #566

Closed
16 tasks done
mj-hof opened this issue Mar 11, 2024 · 2 comments
Closed
16 tasks done

Implement tag #566

mj-hof opened this issue Mar 11, 2024 · 2 comments
Assignees
Labels
dev Requires technical expertise good first issue Tasks that are well suited to get started with developing for Onyx

Comments

@mj-hof
Copy link
Collaborator

mj-hof commented Mar 11, 2024

Why?

Tags are succinct textual labels that provide single-worded information or hints to their related parent element.

Design

Figma link

Acceptance criteria

  • a tag can be shown with one of the available onyx colors
    • primary
    • secondary
    • danger
    • warning
    • success
    • info
  • an optional icon can be shown on the left side
  • the label is truncated with ellipsis (no multiline)

Definition of Done

  • example usage added to alpha-test-app
  • covered by component tests
  • screenshot tests are updated
  • updated version + documentation is deployed
  • Storybook can show the feature
  • Set task to In Approval

Review

Implementation details

  • Use type OnyxColor for color property
  • Use class onyx-truncation-ellipsis for the truncation
@mj-hof mj-hof added this to onyx Mar 11, 2024
@mj-hof mj-hof converted this from a draft issue Mar 11, 2024
@mj-hof mj-hof added the dev Requires technical expertise label Mar 11, 2024
@mj-hof mj-hof added this to the Support components milestone Mar 11, 2024
@JoCa96 JoCa96 assigned larsrickert and unassigned JoCa96 Mar 12, 2024
@larsrickert larsrickert moved this from New to Backlog in onyx Mar 13, 2024
@mj-hof mj-hof moved this from Backlog to Ready in onyx Mar 13, 2024
@JoCa96 JoCa96 added the good first issue Tasks that are well suited to get started with developing for Onyx label Mar 13, 2024
@nerdrun nerdrun self-assigned this Mar 14, 2024
@nerdrun nerdrun moved this from Ready to In Progress in onyx Mar 14, 2024
@nerdrun
Copy link
Contributor

nerdrun commented Apr 14, 2024

Seems like not all the components have their usages in alpha-test-app folder.
Could you let me know the process for example usage added to alpha-test-app checkbox?

@larsrickert
Copy link
Collaborator

Seems like not all the components have their usages in alpha-test-app folder. Could you let me know the process for example usage added to alpha-test-app checkbox?

Usually all components should be used there. Which ones are missing? We will add them then :)

@larsrickert larsrickert self-assigned this Apr 16, 2024
larsrickert added a commit that referenced this issue Apr 19, 2024
Relates to #566

Add `OnyxTag` component

---------

Co-authored-by: nerdrun <[email protected]>
@larsrickert larsrickert moved this from In Progress to In Approval in onyx Apr 19, 2024
larsrickert added a commit that referenced this issue Apr 19, 2024
Relates to #566

Add tag example to alpha demo app
larsrickert added a commit that referenced this issue Apr 19, 2024
Relates to #566

Fix border radius to match with Figma
@github-project-automation github-project-automation bot moved this from In Approval to Done in onyx Apr 25, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
dev Requires technical expertise good first issue Tasks that are well suited to get started with developing for Onyx
Projects
Status: Done
Development

No branches or pull requests

4 participants