fix(accordion): fixing font-family styling, fixed height demo

[brianferry]

What I did

1. Updated the font-family for pf-accordion to "Red Hat Text"
2. Updated the demo page to expand the fixed height demos first panel automatically on load

Related Issues

• [bug][docs] Fix numerous docs style issues #2397
• [bug] Accordion fixed panel variant #2416

[changeset-bot]

🦋 Changeset detected

Latest commit: 2ed37a5

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@patternfly/elements	Patch

Not sure what this means? Click here to learn what changesets are.

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

[github-actions]

✅ Deploy Preview for patternfly-elements ready!

Name	Link
🔨 Latest commit	ade764d
😎 Deploy Preview	https://deploy-preview-2427--patternfly-elements.netlify.app/

---

To edit notification comments on pull requests, go to your Netlify site settings.

[bennypowers]

this is actually incorrect?

https://www.patternfly.org/v4/components/accordion/ shows:

font-family: "RedHatTextUpdated", "Overpass", overpass, helvetica, arial, sans-serif

[brianferry]

Taken from #2397, we're not sending out a RedHatTextUpdated from the issue itself so we would need to update this to Red Hat Text.

[bennypowers]

but accordion needs to match up with pf styles. better to load the updated font on our site rather than diverge, IMO

[bennypowers]

I can see this both ways. In the past, we have said "if we can do better than the pfv4 components...", So I think you could definitely make the argument that this is one of those cases

On the other hand, the source material clearly specifies the "updated" font face. It seems hard to justify making this change just for our docs site, when we could just load that font on the site. Pfe is supposed to be visually agnostic to upstream design choices, so long as it doesn't affect accessibility

[brianferry]

@markcaron thoughts? I agree with what Benny is saying here that pfe should be functionally the same as pf w/r/t styling but wanted to see your thoughts on updating it to RedHatText vs keeping it as RedHatTextUpdated?

[markcaron]

@brianferry @bennypowers, can we not add both to the font stack? That will keep the parity with PFv4's font ("RedHatTextUpdated") as well as work within our site which uses the more universally accepted "Red Hat Text".

font-family: "RedHatTextUpdated", "Red Hat Text", ...

[bennypowers]

but why diverge from patternfly at all? that's why we have the RHDS font tokens

[bennypowers]

can we not add both to the font stack?

we can, but PatternFly doesn't, so we shouldn't. PFE is not supposed to have opinions on things like font stacks, and I don't want to maintain a "tweaks file" which specifies where and how PFE diverges from PatternFly design specs. If we want to change this in the font stack, we have to make a PR to PF core.

[bennypowers]

I'm going to close this because really it's out of scope.

• If we want to change the font stack, we need to do that upstream
• If we want to change the fonts only on our website, we should do that in /docs