nodejs.org
nodejs.org copied to clipboard
feat: Introducing avatar tooltip
Description
I saw it in Slack (OpenJS Foundation) threads and thought it was a good way to support contributors
With this PR, the Tooltip
component was created and minor refactors were made to Avatar
and AvatarGroup
components. In addition, the WithAvatarGroup
component was created to make avatars easier to manage to simplify the process
I took care to use the elements/components in the existing design system as a design, I was inspired by (Search typing) in the Figma for the Tooltip component;
https://www.figma.com/design/pu1vZPqNIM7BePd6W8APA5/Node.js?node-id=464-6397&node-type=frame&t=dj6OGYBZLLo5cp4z-0
Validation
- Avatars should continue to work as it is.
- A tooltip should appear for users in
authors.json
whose website field is exist
Example screenshot;
Related Issues
Related to #7141
Check List
- [x] I have read the Contributing Guidelines and made commit messages that follow the guideline.
- [x] I have run
npm run format
to ensure the code follows the style guide. - [x] I have run
npm run test
to check if all tests are passing. - [x] I have run
npx turbo build
to check if the website builds without errors. - [x] I've covered new added functionality with unit tests if necessary.