Figma component > Add fitted tabs
Description
Adding fitted (responsive) tabs to the component library. Per Pajamas…
When tabs are used in a narrow container, column, or space, the tabs themselves may be fitted to the entire width instead of remaining left aligned.
Because of limitations with auto layout, the fitted tab group container will be resized manually. 2-up and 3-up options are available instead of turning on/off individual tabs since the outer container can’t use auto layout.
Figma file
Checklist
Make sure the following are completed before closing the issue:
-
Assignee: Design in your Figma draft file, following our structure, building, and annotation guidelines. If you have any questions, reach out to a FE/UX Foundations designer. -
Assignee: Update the link to the Figma file in the issue description. -
Assignee: Ask a FE/UX Foundations designer to review your changes (ensure they have edit permissions in Figma). -
Reviewer: Review and approve assignee’s changes. Ensure that they include all variations/states and, if applicable, matches existing Sketch specs and is responsive. -
Reviewer: Assign to a Figma maintainer for final review (make sure they have edit permissions in Figma). -
Maintainer: Review and approve assignee’s changes. -
Maintainer: Apply the changes to the Pajamas UI Kit file, and view the components in the Assets panel to ensure they align with our asset library structure guidelines. -
Maintainer: Publish the library changes along with a clear commit message. -
Assignee: Move your draft file to the Component archive Figma project. If you're a community contributor, we ask that you transfer ownership of your draft file to the maintainer so they can move it to our archive, along with its version history and comments. -
Assignee (or Maintainer, for community contributions): If it's a new pattern or a significant change, add an agenda item to the next UX weekly call to inform everyone. -
Assignee: Create a merge request in this repository with the component-guideline template to create or update the component's documentation page. Link it here as a related merge request. Use View design in Pajamas UI Kit →
for the link text. This replaces any existing link to Sketch Measure specs. Anyone with the link should be able to view the file. -
Assignee: Create an issue in GitLab UI to build or update the component code. Mark the new issue as related to this one. -
Assignee: 🎉 Congrats, you made it! You can now close this issue.
Edited by Jeremy Elder