feat(card): overflow hidden on cover photo for swc implementation

[jawinn]

Description

Adds overflow hidden to the .spectrum-Card-coverPhoto class, to help resolve an issue in the SWC implementation that uses sp-asset.

In SWC the photo could appear from behind the corners of the card. For example, when increasing the corner rounding when setting the mod --mod-card-corner-radius. This issue is not visible in Spectrum CSS. This overflow property used to exist in SWC as a CSS override, but is preferred to exist here in CSS.

Example of the issue in SWC:
Set --mod-card-corner-radius: 24px on the sp-card in the first example on the SWC docs site:

Setting overflow: hidden on the #cover-photo selector via the inspector fixes the issue. The spectrum-config in SWC converts our class to that ID (converter.classToId('spectrum-Card-coverPhoto', 'cover-photo')).

CSS-734

How and where has this been tested?

Please tag yourself on the tests you've marked complete to confirm the tests have been run by someone other than the author.

Validation steps

• Changes do not affect the component in Spectrum CSS.

Regression testing

Validate:

1. The documentation pages for at least two other components are still loading, including:

• The pages render correctly, are accessible, and are responsive.

2. If components have been modified, VRTs have been run on this branch:

• VRTs have been run and looked at.
• Any VRT changes have been accepted (by reviewer and/or PR author), or there are no changes.

Screenshots

To-do list

• I have read the contribution guidelines.
• I have tested these changes in Windows High Contrast mode.
• ✨ This pull request is ready to merge. ✨

[changeset-bot]

⚠️ No Changeset found

Latest commit: 9b843e1

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[github-actions]

🚀 Deployed on https://pr-2661--spectrum-css.netlify.app

[github-actions]

File metrics

Summary

Total size: 4.57 MB^*
Total change (Δ): ⬆ 0.05 KB (0.00%)

Table reports on changes to a package's main file. Other changes can be found in the collapsed Details section below.

Package	Size	Δ
card	22.74 KB	⬆ 0.02 KB

Details

card

File	Head	Base	Δ
index-base.css	22.74 KB	22.72 KB	⬆ 0.02 KB (0.08%)
index-vars.css	22.74 KB	22.72 KB	⬆ 0.02 KB (0.08%)
index.css	22.74 KB	22.72 KB	⬆ 0.02 KB (0.08%)
metadata.json	9.50 KB	9.50 KB	-

* Size determined by adding together the size of the main file for all packages in the library.
* Results are not gzipped or minified.
* An ASCII character in UTF-8 is 8 bits or 1 byte.