Repository navigation
[bug][docs] Fix numerous docs style issues #2397
Description
Activity
- addedpriority: mediumSeverity level: 2Severity level: 2and removedpriority: lowSeverity level: 3Severity level: 3
on Feb 28, 2023 - modified the milestones: PatternFly Elements 2.0 (aka PF 1:1), PatternFly Elements 2.x
on Mar 10, 2023 - Fix v1/v2 toggle to be consistent in style
- Have v1/v2 toggle go directly to All Components (not individual components)
I believe we are deferring these due to symlinking to the
v1docs and not directly maintaining their templates.- Move overview description into page heading
Due to the usage of
pfe-toolsto render these pages we can't modify these without a breaking change to child repos.- Icon doesn't match PatternFly's
The difference is between font awesome version 6 and version 5
https://fontawesome.com/v6/icons/copy?s=solid&f=classic
https://fontawesome.com/v5/icons/copy?s=solid&f=classic
@bennypowers was this the intent of
pf-iconto use version 6 of fontawesome rather then version 5?- Icon size
The icon sizes are not the same as PFv4 clipboard. Currently, the copy icon is showing up at 10px which is the default size of a
<pf-icon>with no-size variant given (eg. size="sm|md|lg").pf-iconsize API does not allow for a 16px icon, even though this is the size that PFv4 itself uses for many of its components, this issue has come up in several places includingpf-tabsand downstream in RHDS. You can override this with CSS prop--pf-icon--size: 16px.Patternfly icon states this same intent of 10px = sm,18px = md, 24px = lg, 54px = xl. Even though use cases throughout PFv4 of a 16px size
<svg>are used in components for many icons.The reason this is being exposed is that these components are not directly using the PF
<Icon/>react component like we are reusing the<pf-icon>in our web components. This is the discrepancy that is causing the size issue differences.[ ] Font changes on in-page demos, like accordion's constructed stylesheet (i.e., "Red Hat Text" vs "RedHatTextUpdated")
@brianferry will you take a look at this one with Accordion? I'm pretty sure the solution here is just to remove "RedHatTextUpdated" and replace it with "Red Hat Text" as we won't serve "RedHatTextUpdated" on any of the sites this gets used on. If I understand the issue correctly. I believe @markcaron can expand on that if needed.
@zeroedin No need to adjust the band padding. I marked off the item from the checklist above. But, I added a item below it to remove the extra
<p>between bands.@markcaron @hellogreg please take a quick look and see if we can maybe close this and open some new, targeted issues on the PFE milestone
There are multiple style issues throughout PFE doc pages:
Fix v1/v2 toggle to be consistent in style(see comment below)Have v1/v2 toggle go directly to All Components (not individual components)(see comment below)Move overview description into page heading(see comment below)Fix spacing between "bands"(see comment below)<p>between bands ([docs][bug] Remove extra spacing between bands coming from extra <p> #2419) docs: hide empty <p> elements #2421cornflowerbluewhich seems to be a poor color choice. docs: update developer content #2409