Experimental rules

[AlbertSmit]

I’ve added three new rules to keep our CSS structured, and cleaned up some internal machinery to support them.

What's added:

• no-hardcoded-colors: Walks PostCSS declarations to block raw hex, rgb, rgba, and hsl values in component files. It permits variable definitions (like gradients) and ignores theme/infra files so token setup still works.
• color-variable-layering: Enforces the 3-layer color setup. At lint-time, it parses style-contexts.css in the project's cssGlobal directory to build an allowlist of context tokens. Any other --color-* variables used in component declarations will be flagged.
• media-query-convention: Enforces mobile-first design by flagging max-width queries (unless combined with complex queries like orientation). If cssGlobal is configured, it parses the project's media.js (Object literals) or media.css (@custom-media) to validate query breakpoints and flag typos.

Internal refactoring:

• Split cssGlobal.js: Isolated the media/breakpoint parsing and test-seeding caches into a new breakpoints.js utility, leaving only file-reading and path validation in cssGlobal.js.
• Rule Options: Updated callPlugin in kaliber.js to pass secondaryOptionObject as options so rules can read configuration (like the cssGlobal path).

[coderabbitai]

Important

Review skipped

Draft detected.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 96a5aab9-8507-44ca-b557-4ae67dd71d98

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch experimental-rules

---

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