fix: [M3-9856] - Fix text layout for Notices with multiple children

[hkhalil-akamai]

Description 📝

Fixes a visual regression following the CDS refactor of the Notice component in #12004.

Changes 🔄

• Removes display: flex from the children of the Notice components
  • Alternatively, we can wrap the contents in Typography for each affected Notice -- I am open to discussion surrounding this approach
• Adds an additional stack in DismissibleNotice to replace the flexbox removed above

Preview 📷

Prod	This Branch

How to test 🧪

• Verify Notices with multiple children render text and whitespace correctly.
  • An example of an affected Notice can be found when creating an image in a distributed region (see screenshot above)
• Verify existing Notices continue to render as expected. Several variations are included in the screenshot above.
  • DismissibleBanner
  • Notices with action button
  • Notices with forceImportantIconVerticalCenter enabled

Author Checklists

As an Author, to speed up the review process, I considered 🤔

👀 Doing a self review
❔ Our contribution guidelines
🤏 Splitting feature into small PRs
➕ Adding a changeset
🧪 Providing/improving test coverage
🔐 Removing all sensitive information from the code and PR description
🚩 Using a feature flag to protect the release
👣 Providing comprehensive reproduction steps
📑 Providing or updating our documentation
🕛 Scheduling a pair reviewing session
📱 Providing mobile support
♿ Providing accessibility support

• I have read and considered all applicable items listed above.

As an Author, before moving this PR from Draft to Open, I confirmed ✅

• All unit tests are passing
• TypeScript compilation succeeded without errors
• Code passes all linting rules

[linode-gh-bot]

Cloud Manager UI test results

🔺 4 failing tests on test run #5 ↗︎

❌ Failing	✅ Passing	↪️ Skipped	🕐 Duration
4 Failing	563 Passing	5 Skipped	156m 39s

Details

Failing Tests
	Spec	Test
❌	vpc-landing-page.spec.ts	Cloud Manager Cypress Tests→VPC landing page » VPC landing page
❌	smoke-community-stackscripts.spec.ts	Cloud Manager Cypress Tests→Community Stackscripts integration tests » Community Stackscripts integration tests
❌	smoke-community-stackscripts.spec.ts	Cloud Manager Cypress Tests→Community Stackscripts integration tests » Community Stackscripts integration tests
❌	access-keys-multicluster.spec.ts	Cloud Manager Cypress Tests→Object Storage Multicluster access keys » Object Storage Multicluster access keys

Troubleshooting

Use this command to re-run the failing tests:

pnpm cy:run -s "cypress/e2e/core/vpc/vpc-landing-page.spec.ts,cypress/e2e/core/stackscripts/smoke-community-stackscripts.spec.ts,cypress/e2e/core/objectStorageMulticluster/access-keys-multicluster.spec.ts"

[coliu-akamai]

looks good, thank you! 🚀

unrelated to this PR - is there a ticket to move this notice's icon to the top of the notice?

[hkhalil-akamai]

unrelated to this PR - is there a ticket to move this notice's icon to the top of the notice?

It looks like it's intentional as that notice has forceImportantIconVerticalCenter set

[coliu-akamai]

ahh I see thanks for checking!

[hkhalil-akamai]

Test failures appear unrelated.