First row below the header in `Primer::Beta::Box` has rounded corners

[HDinger]

Version

0.19.0

Steps to reproduce

• Use a Primer::Beta::BorderBox like defined here: https://view-components-storybook.eastus.cloudapp.azure.com/view-components/lookbook/inspect/primer/beta/border_box/default
  • Take care, that there is at least one header and one row

e.g.

render(Primer::Beta::BorderBox.new) do |component|
  component.with_header { "Header" }
  component.with_body { "Body" }
  component.with_row { "Row one" }
  component.with_row { "Row two" }
end

Actual behavior

• The row has additional round corners at the top which looks weird because the header (or the body) is directly at the top:

• This becomes especially obvious in the high contrast themes
• The same issue appears when there is a body used but no footer:

Expected behavior

• There should be no rounded corners if a header (or a body) is defined.

[github-actions[bot]]

Hi! This issue has been marked as stale because it has been open with no activity for 180 days. You can comment on the issue or remove the stale label to keep it open. If you do nothing, this issue will be closed in 7 days.

[HDinger]

Please leave it open.

[jonrohan]

Sorry this has been hanging around a while. We've been discussing the best approach here. The feeling is that a css only fix might lead to other regressions, but we're talking about the idea of adding supplemental classes in ruby to signify last/first elements in the row.

[github-actions[bot]]

Hi! This issue has been marked as stale because it has been open with no activity for 180 days. You can comment on the issue or remove the stale label to keep it open. If you do nothing, this issue will be closed in 7 days.

[HDinger]

Please leave it open.