PageHeader: Update stories to address a11y feedback (elements losing context when resizing)

[broccolinisoup]

This PR should merge into the main PageHeader sign-off review feedback PR.

There are a few elements in the design spec whose content varies depending on the viewport size. For example an action button's text is "New Webhook" in regular and large viewport but the button loses its context in the narrow viewport and becomes "New". Same example for the Pull request description slot that you can see in the diff.

The feedback came from the sign-off review and A11y Design team advises that we should aim for keeping the button text same in all viewports. Using shorten text to space space should be the absolute last possible option. (Slack reference - GitHub stuff only link)

Changelog

New

Changed

Updated the storybook examples to align with what A11y Design recommended.

Note: I only asked about the button and took the liberty to update the pull request description as well because I think it is the same deal. Let me know if you have a different opinion. Also, this is how we do it now too for production pull request descriptions.

Removed

Rollout strategy

• [x] Patch release
• [ ] Minor release
• [ ] Major release; if selected, include a written rollout or migration plan

Testing & Reviewing

You can view the stories on https://primer-6c417465dd-13348165.drafts.github.io/storybook/?path=/story/drafts-components-pageheader-examples--pull-request-page-on-narrow-viewport or refer to the snapshot update in the diff

Merge checklist

• [ ] Added/updated tests
• [ ] Added/updated documentation
• [x] Added/updated previews (Storybook)
• [ ] Changes are SSR compatible
• [x] Tested in Chrome
• [ ] Tested in Firefox
• [ ] Tested in Safari
• [ ] Tested in Edge
• [ ] Integration tests pass at github/github (Learn more about how to run integration tests)

Take a look at the What we look for in reviews section of the contributing guidelines for more information on how we review PRs.

[changeset-bot[bot]]

⚠️ No Changeset found

Latest commit: 17ff0e180a8b042fcc517e03ac3a5c5a1b448c64

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[github-actions[bot]]

size-limit report 📦

Path	Size
dist/browser.esm.js	104.25 KB (0%)
dist/browser.umd.js	104.79 KB (0%)

[github-actions[bot]]

Hi! This pull request has been marked as stale because it has been open with no activity for 60 days. You can comment on the pull request or remove the stale label to keep it open. If you do nothing, this pull request will be closed in 7 days.