[BD-46] is-mutted props for card

[Inferato]

Description

is-mutted props for Card component were added

Github issue: #1376

Deploy Preview

https://deploy-preview-1455--paragon-openedx.netlify.app/components/card/

Merge Checklist

• If your update includes visual changes, have they been reviewed by a designer? Send them a link to the Netlify deploy preview, if applicable.
• Does your change adhere to the documented style conventions?
• Do any prop types have missing descriptions in the Props API tables in the documentation site (check deploy preview)?
• Were your changes tested using all available themes (see theme switcher in the header of the deploy preview, under the "Settings" icon)?
• Were your changes tested in the example app?
• Is there adequate test coverage for your changes?
• Consider whether this change needs to reviewed/QA'ed for accessibility (a11y). If so, please add wittjeff and adamstankiewicz as reviewers on this PR.

Post-merge Checklist

• Verify your changes were released to NPM at the expected version.
• If you'd like, share your contribution in #show-and-tell.
• 🎉 🙌 Celebrate! Thanks for your contribution.

[openedx-webhooks]

Thanks for the pull request, @Inferato!

When this pull request is ready, tag your edX technical lead.

[netlify]

✅ Deploy Preview for paragon-openedx ready!

Built without sensitive environment variables

Name	Link
🔨 Latest commit	804d41f
🔍 Latest deploy log	https://app.netlify.com/sites/paragon-openedx/deploys/62d0fe3c93f32e0008993045
😎 Deploy Preview	https://deploy-preview-1455--paragon-openedx.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[codecov]

Codecov Report

Merging #1455 (804d41f) into master (ba78533) will not change coverage.
The diff coverage is n/a.

@@           Coverage Diff           @@
##           master    #1455   +/-   ##
=======================================
  Coverage   91.30%   91.30%           
=======================================
  Files         205      205           
  Lines        3438     3438           
  Branches      799      799           
=======================================
  Hits         3139     3139           
  Misses        285      285           
  Partials       14       14           

Impacted Files	Coverage Δ
src/Card/index.jsx	100.00% <ø> (ø)

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update ba78533...804d41f. Read the comment docs.

[adamstankiewicz]

@Inferato The Card.Section component already accepts a muted prop to have this styling, e.g.:

<Card>
  <Card.Section muted>
    This is a card section. It can contain anything but usually text, a list, or list of links. Multiple sections have a card divider between them.
  </Card.Section>
</Card>

This issue was largely to provide an example of what a standalone muted Card.Section looks like, not introducing a muted prop on the top-level Card itself; I should have been more explicit in the issue description, my bad!

We do show an example Card.Section with muted already but I think I'd like to see the muted example as the only Card.Section inside of the Card so the resulting effect is a card completely filled with the muted, light gray background.

[adamstankiewicz]

@Inferato The Card.Section component already accepts a muted prop to have this styling, e.g.:

<Card>
  <Card.Section muted>
    This is a card section. It can contain anything but usually text, a list, or list of links. Multiple sections have a card divider between them.
  </Card.Section>
</Card>

This issue was largely to provide an example of what a standalone muted Card.Section looks like, not introducing a muted prop on the top-level Card itself; I should have been more explicit in the issue description, my bad!

We do show an example Card.Section with muted already but I think I'd like to see the muted example as the only Card.Section inside of the Card so the resulting effect is a card completely filled with the muted, light gray background.

Ignore this. After clarifying with UX during the RG sync, we decided to continue to work with a muted prop on the top-level Card component.

[openedx-webhooks]

@Inferato 🎉 Your pull request was merged! Please take a moment to answer a two question survey so we can improve your experience in the future.

[edx-semantic-release]

🎉 This PR is included in version 20.6.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀