search

primer / brand

React components and Primitives for GitHub marketing websites
https://primer.style/brand
MIT License
69 stars 31 forks source link

🐛 [BUG] - Margin removed when using a `className` with `Hero.Label` #757

Open simurai opened 1 week ago

simurai commented 1 week ago

Describe the bug

When adding a className to a Hero.Label, it removes the bottom margin.

Reproduction steps

  1. Go to https://primer.style/brand/components/Hero/react
  2. In the editor, add className="someClass" to the Hero.Label of the first example.
  3. Notice how the bottom margin is gone.

I think the Hero-module--Hero-label--C\+rTh class (that adds the bottom margin) gets removed from the DOM once a custom class is added?

Expected behavior

The bottom margin should stay.

Screenshots

Screenshot of a label without bottom margin

Browsers

Chrome

OS

Mac

joshfarrant commented 1 week ago

Good spot, thanks @simurai.

I've got a PR here which resolves the issue

https://github.com/primer/brand/pull/760