fix: Cloud Config parameter modal overlays non-printable character info box

[mtrezza]

Pull Request

• Report security issues confidentially.
• Any contribution is under this license.

Issue

Cloud Config parameter modal overlays non-printable character info box.

Summary by CodeRabbit

• Style
  • Updated the non-printable highlighter component layout for improved organization.
  • Adjusted non-alphanumeric info badge spacing for better visual alignment.

[parse-github-assistant]

🚀 Thanks for opening this pull request!

[coderabbitai]

📝 Walkthrough

Walkthrough

This pull request modifies the styling of the NonPrintableHighlighter component by adding flexbox layout to its container and adjusting the spacing of the non-alphanumeric info badge element.

Changes

Cohort / File(s)	Summary
NonPrintableHighlighter Styling src/components/NonPrintableHighlighter/NonPrintableHighlighter.scss	Adds flex display with column direction to container; adjusts info badge margin-top from -4px to 0.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~2 minutes

Possibly related PRs

• feat: Add non-alphanumeric character detection in Cloud Config parameters #3143: Modifies the same NonPrintableHighlighter.scss file and the spacing adjustments directly affect the info-badge layout introduced in that PR.
• feat: Detect and warn about unprintable characters in Cloud Config parameter values #3119: NonPrintableHighlighter component styling changes that build upon the component implementation from that PR.
• fix: Non-printable character box missing when editing Cloud Config parameter #3218: Also modifies NonPrintableHighlighter.scss with adjustments to container spacing.

🚥 Pre-merge checks | ✅ 3 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Description check	⚠️ Warning	The description is incomplete; it only includes the Issue section while missing the required Approach and Tasks sections from the template.	Add the Approach section describing the styling changes made to fix the overlay issue, and include the Tasks section with relevant checkboxes.

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and specifically describes the main issue being fixed: a Cloud Config parameter modal overlaying a non-printable character info box.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Merge Conflict Detection	✅ Passed	✅ No merge conflicts detected when merging into alpha

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

No actionable comments were generated in the recent review. 🎉

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[parseplatformorg]

✅ Snyk checks have passed. No issues have been found so far.

Status	Scanner	Critical	High	Medium	Low	Total (0)
✅	Open Source Security	0	0	0	0	0 issues

💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse.

[parseplatformorg]

🎉 This change has been released in version 9.0.0-alpha.5

[parseplatformorg]

🎉 This change has been released in version 9.0.0