fix: added border-box to panel to fix border offset

[heyMP]

Adds box-sizing: border-box; to the accordion-panel. Corrects the border offset in the panels.

Related issues

• fix: pfe-accordion-panel  #1809

Preview

Link(s) to demo page(s) where this element can be viewed:

• pfe-accordion demo

Testing instructions

• Verify border alignment fix. upgraded storybook to the latest alpha release and added a command fo… #1
  1. Go to https://deploy-preview-1810--patternfly-elements.netlify.app/elements/pfe-accordion/demo/?accordion-with-history=1
  2. In the browsers network devtools, block the following file: pfe-base.css. (This contains a global fix which is why we weren't seeing the issue).
  3. Refresh the page with devtools open.
  4. Open the first accordion item that contains a nested accordion item. Open the nested item.
  5. Verify that the right border on the nest accordion is straight.

Example

Example

Browser requirements

Your component should work in all of the following environments:

• Latest 2 versions of Edge
• Internet Explorer 11 (should be useable, not pixel perfect)
• Latest 2 versions of Firefox (one on Mac OS, one of Windows OS)
• Firefox 78 (or latest version for Red Hat Enterprise Linux distribution)
• Latest 2 versions of Chrome (one on Mac OS, one of Windows OS)
• Latest 2 versions of Safari
• Android mobile device (such as the Galaxy S9)
• Apple mobile device (such as the iPhone X)
• Apple tablet device (such as the iPhone Pro)

Ready-for-merge Checklist

• Expected files: all files in this pull request are related to one request or issue (no stragglers or scope-creep).
• Tests have been updated to cover these changes.
• Browser testing passed.
• Changelog updated.
• Documentation (README.md, WHY.md, etc.) updated or added.
• Link to the demo recording:
• Approved by designer.

Merging

Please squash when merging and ensure your commit message uses conventional commit formatting.

Be sure to share your updates with the [email protected] mailing list!

[netlify]

✔️ Deploy Preview for patternfly-elements ready!

🔨 Explore the source changes: 399e606

🔍 Inspect the deploy log: https://app.netlify.com/sites/patternfly-elements/deploys/6193b605902e4f00080db6e4

😎 Browse the preview: https://deploy-preview-1810--patternfly-elements.netlify.app

[kylebuch8]

Local Grapes To Mead?