fix: define allowed styles in readme

[43081j]

🔗 Linked issue

N/A

🧭 Context

N/A

📚 Description

This changes the sanitization to set allowedStyles to only what shiki
emits, since nothing else we run needs to emit inline styles.

Also escapes image attributes.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
npmx.dev	Ready	Preview, Comment	Apr 14, 2026 6:28pm

2 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
docs.npmx.dev	Ignored	Preview	Apr 14, 2026 6:28pm
npmx-lunaria	Ignored		Apr 14, 2026 6:28pm

[coderabbitai]

Caution

Review failed

Pull request was closed or merged during review

📝 Walkthrough

Summary by CodeRabbit

• Bug Fixes

  • Enhanced security by properly escaping HTML attributes within image metadata, including titles and alternative text values.
  • Strengthened HTML content sanitisation by restricting style attributes on generated elements and limiting permitted style values to valid hex colour patterns.

• Performance

  • Improved browser rendering efficiency through CSS layout and paint containment optimisations.

Walkthrough

The PR updates HTML rendering in README components. Changes include adding CSS containment to the Vue component, and hardening HTML sanitisation in the server utility by removing unsafe style attributes from tags, HTML-escaping image attributes, and restricting allowed styles to hex colour patterns.

Changes

Cohort / File(s)	Summary
Vue Component Styling app/components/Readme.vue	Adds contain: layout paint; to the root .readme container, extending containment-related browser optimisations alongside existing isolation rules.
HTML Sanitisation Hardening server/utils/readme.ts	Removes style attributes from pre and div tags in sanitisation allowlists, HTML-escapes title and alt values in generated images, and restricts allowed inline styles to hex colour patterns (#RGB/#RRGGBB) on span elements only.

Suggested reviewers

• ghostdevv

🚥 Pre-merge checks | ✅ 2

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'fix: define allowed styles in readme' accurately reflects the main change: restricting CSS style allowlists in the readme sanitization configuration.
Description check	✅ Passed	The description is directly related to the changeset, explaining the sanitization updates and image attribute escaping implemented in the pull request.

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

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch jg/textual-horrors

---

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.}

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ All tests successful. No failed tests found.

📢 Thoughts on this report? Let us know!