fix(pie-toast): DSW-000 truncate text with css

[raoufswe]

Describe your changes (can list changeset entries if preferable)

• To truncate text in CSS, we typically need a specified width for the container to determine when truncation should happen. Currently, we use JavaScript in pie-toast to calculate the container's width and various action widths to ensure proper text truncation.
• This PR simplifies the solution using a CSS flexbox trick that allows text truncation without knowing the exact container width, as shown in this CodePen (Demo 3b).
• Updates the readme file for toast and notification to point to the docs site (cleanup)

Author Checklist (complete before requesting a review)

• I have performed a self-review of my code
• I have added thorough tests where applicable (unit / component / visual)
• I have reviewed the PIE Storybook/PIE Docs PR preview
• I have reviewed visual test updates properly before approving
• If changes will affect consumers of the package, I have created a changeset entry.

Reviewer checklists (complete before approving)

Reviewer 1 - @fernandofranca

• I have reviewed the PIE Storybook/PIE Docs PR preview
• If there are visual test updates, I have reviewed them

Reviewer 2

• I have reviewed the PIE Storybook/PIE Docs PR preview
• If there are visual test updates, I have reviewed them

[changeset-bot]

🦋 Changeset detected

Latest commit: 43dd6c5

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 8 packages

Name	Type
@justeattakeaway/pie-toast	Patch
pie-storybook	Patch
@justeattakeaway/pie-webc	Patch
wc-angular12	Patch
wc-nuxt2	Patch
wc-react17	Patch
wc-react18	Patch
wc-vue3	Patch

Not sure what this means? Click here to learn what changesets are.

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