Skip to content

fix(app-webdir-ui): render profile card title as bold text instead of h4#1746

Open
juanmitriatti wants to merge 1 commit into
devfrom
UDS-2163
Open

fix(app-webdir-ui): render profile card title as bold text instead of h4#1746
juanmitriatti wants to merge 1 commit into
devfrom
UDS-2163

Conversation

@juanmitriatti

@juanmitriatti juanmitriatti commented Jul 17, 2026

Copy link
Copy Markdown
Contributor

Summary

Accessibility fix (JSM "Web Directory - hdatds"): the profile card rendered the person's title in an <h4>, causing a skipped heading level on consuming sites. The title is now <p class="person-profession-title"><strong>…</strong></p> — no heading, same visual design.

Changes

  • app-webdir-ui ProfileCard and unity-react-core PersonProfile: h4p.person-profession-title > strong
  • unity-bootstrap-theme _person-profile.scss: new class styled identically to the old h4 (1rem, 700, 1.625rem line-height, 2-line clamp); h4 selectors kept for backward compatibility
  • Storybook template updated

Testing

  • New ProfileCard tests: title is not a heading, renders as bold text in a paragraph
  • PersonProfile tests updated; all 210 unity-react-core tests pass
  • Verified in Storybook: before/after pixel-identical

The Web Directory profile card rendered the person's work title in an
h4, causing a skipped heading level on consuming sites where the card
name is not a heading (accessibility issue).

- ProfileCard (app-webdir-ui) and PersonProfile (unity-react-core) now
  render the title as p.person-profession-title > strong
- unity-bootstrap-theme styles the new class identically to the old h4
  (1rem, 700 weight, 1.625rem line-height, 2-line clamp); h4 selectors
  kept for backward compatibility with published consumers
- person-profile Storybook template updated to the new markup
@juanmitriatti
juanmitriatti requested a review from a team as a code owner July 17, 2026 13:07
@asu-jenkins-devops

Copy link
Copy Markdown
Collaborator

@juanmitriatti juanmitriatti self-assigned this Jul 17, 2026
@juanmitriatti juanmitriatti added the enhancement New feature or request label Jul 17, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants