fix(callout-quote): content off grid

[sangeethababu9223]

Related Ticket(s)

Closes #10050

Description

Callout Grid - Content was Off Grid.

Changelog

New

• Added an offset to match the figma

Changed

• Changed Column width for the grid.

[github-actions]

DCO Assistant Lite bot: Thanks for your submission! We ask that you all sign our Developer Certificate of Origin before we can accept your contribution. You can sign the DCO by adding a comment below using this text:

---

I have read the DCO document and I hereby sign the DCO.

---

1 out of 2 committers have signed the DCO.
✅ @sangeethababu9223
❌ @sangeetha Babu
Sangeetha Babu seems not to be a GitHub user. You need a GitHub account to be able to sign the DCO. If you have already a GitHub account, please add the email address used for this commit to your account.
_{You can retrigger this bot by commenting recheck in this Pull Request}

[ibmdotcom-bot]

Deploy preview created for package React:
https://ibmdotcom-react.s3.us-south.cloud-object-storage.appdomain.cloud/deploy-previews/10865/index.html

Built with commit: 8c5e13e405f1a2bf9f59d0e1c4e70960edc2ae69

[ibmdotcom-bot]

Deploy preview created for package Carbon Web Components:
https://carbon-web-components.s3.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/10865/index.html

Built with commit: 8c5e13e405f1a2bf9f59d0e1c4e70960edc2ae69

[ibmdotcom-bot]

Deploy preview created for package Web Components (React wrapper):
https://ibmdotcom-web-components-react.s3-web.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/10865/index.html

Built with commit: d2149b1349988beca16d466de949978da6ed16f8

[ibmdotcom-bot]

Deploy preview created for package Web Components:
https://ibmdotcom-webcomponents.s3.us-east.cloud-object-storage.appdomain.cloud/deploy-previews/10865/index.html

Built with commit: d2149b1349988beca16d466de949978da6ed16f8

[RichKummer]

Hey @sangeethababu9223 ! It looks like the callout quote has the proper spacing on @sm breakpoint. When I'm looking at larger breakpoints, it doesn't seem like the text is flush with the column.

@md

@xlg

The expected behavior is that the text (quote, attribution below, and link) are flush with the column edge, unless the component is @sm. The opening quote mark should then overhang the text on the left. Compare with the specs below:

@md

@xlg