fix: update Indicator styles

[rohanchkrabrty]

Summary

• Indicator with a label now enforces a minimum 18x18 circle, expanding into an oval as content grows.
• Content is centered via flex so single-character labels stay visually balanced inside the circle.
• Dot indicator (no label) shrunk from 8px to 6px to match the Figma spec.

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
apsara	Ready	Preview, Comment	Apr 30, 2026 9:49am

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 11b90677-73aa-4956-ac31-967611214c18

📥 Commits

Reviewing files that changed from the base of the PR and between fddcf49 and 09bcddd.

📒 Files selected for processing (1)

• packages/raystack/components/indicator/indicator.module.css

---

📝 Walkthrough

Walkthrough

The indicator component CSS styling is refactored to use anchored positioning instead of negative offset calculations. The positioning approach changes from using calc(-1 * var(--rs-space-2)) to top: 0 and right: 0 with a translate(50%, -50%) transform. The display layout shifts to inline-flex with centered alignment. Label-specific positioning logic and length-dependent spacing rules are removed, replaced with fixed dimensions of min-width: 18px and height: 18px for indicators with labels. The dot element size transitions from theme spacing variables to a fixed 5px by 5px dimension.

---

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

_{Review rate limit: 0/1 reviews remaining, refill in 60 minutes.}

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