All Products: make atomic blocks margin consistent to improve alignment

[Aljullu]

In the All Products block there are some alignment issues when products have different inner blocks. In the screenshot below, you can see the Sale badge has more top margin than the price, so the products look misaligned:

It's a bit complex because some of ours styles are overwritten by Storefront and Gutenberg styles.

I did a quick research and this is the inner blocks and the margins they have:

• Product image
  • Bottom: 1.618em = 22.65px
• Product title
  • Top: 12px (SF overwrites this to 0.5407911001em = 8.65px)
• Sale badge
  • Top: 8px
  • Bottom: 8px (SF overwrites this to 1em = 12.25px)
• Product price
  • Bottom: 12px (in 'legacy' product grid it's 1rem = 16px)
• Rating
  • Bottom: 12px
• Button
  • Bottom: 12px (GB overwrites this to 1.41575em = 19.8px)

In bold, the styles that end up being applied in a store with Storefront installed. Also notice the mix between px and em makes the styles not to play well with some themes.

[github-actions]

This issue has been marked as stale because it has not seen any activity within the past 60 days. Remove the stale label or post a comment, otherwise it will be closed in 10 days.

[github-actions]

This issue has been marked as stale because it has not seen any activity within the past 60 days. Our team uses this tool to help surface issues for review. If you are the author of the issue there's no need to comment as it will be looked at.

Internal: After 10 days with no activity this issue will be automatically be closed.

[github-actions]

This issue has been marked as stale because it has not seen any activity within the past 60 days. Our team uses this tool to help surface issues for review. If you are the author of the issue there's no need to comment as it will be looked at.

Internal: After 10 days with no activity this issue will be automatically be closed.

[github-actions]

This issue has been marked as stale because it has not seen any activity within the past 60 days. Our team uses this tool to help surface issues for review. If you are the author of the issue there's no need to comment as it will be looked at.

Internal: After 10 days with no activity this issue will be automatically be closed.

[github-actions]

This issue has been marked as stale because it has not seen any activity within the past 60 days. Our team uses this tool to help surface issues for review. If you are the author of the issue there's no need to comment as it will be looked at.

Internal: After 10 days with no activity this issue will be automatically be closed.

[github-actions]

This issue has been marked as stale because it has not seen any activity within the past 60 days. Our team uses this tool to help surface issues for review. If you are the author of the issue there's no need to comment as it will be looked at.

Internal: After 10 days with no activity this issue will be automatically be closed.

[github-actions]

This issue has been marked as stale because it has not seen any activity within the past 60 days. Our team uses this tool to help surface issues for review. If you are the author of the issue there's no need to comment as it will be looked at.

Internal: After 10 days with no activity this issue will be automatically be closed.

[github-actions]

This issue has been marked as stale because it has not seen any activity within the past 60 days. Our team uses this tool to help surface issues for review. If you are the author of the issue there's no need to comment as it will be looked at.

Internal: After 10 days with no activity this issue will be automatically be closed.

[github-actions]

This issue has been marked as stale because it has not seen any activity within the past 60 days. Our team uses this tool to help surface issues for review. If you are the author of the issue there's no need to comment as it will be looked at.

Internal: After 10 days with no activity this issue will be automatically be closed.

[github-actions]

This issue has been marked as stale because it has not seen any activity within the past 60 days. Our team uses this tool to help surface issues for review. If you are the author of the issue there's no need to comment as it will be looked at.

Internal: After 10 days with no activity this issue will be automatically be closed.

[Aljullu]

I'm going to close this issue. We are revisiting the margins for the Products block (#7954), but decided not to modify them in the All Products block.