Skip to content

style(answer): tighten spacing under the Sources capsule#681

Merged
BigSimmo merged 1 commit into
mainfrom
claude/source-button-styling-iyba2y
Jul 14, 2026
Merged

style(answer): tighten spacing under the Sources capsule#681
BigSimmo merged 1 commit into
mainfrom
claude/source-button-styling-iyba2y

Conversation

@BigSimmo

Copy link
Copy Markdown
Owner

Summary

  • Follow-up to style(answer): shrink and refine the Sources capsule #678 (merged). Reduces the vertical gap under the "Sources" capsule and pulls the "Copy with sources" row up closer to it.
  • The capsule and the copy control each keep a 44px WCAG tap target with small, vertically-centered content, so a lot of the visible gap was transparent hit-area padding (~9px under the pill + ~14px above the copy label) plus space-y. This tightens the answer stack to space-y-1 and pulls the capsule group down with -mb-2, so the copy row sits directly beneath the pill.
  • Measured on mobile (390px): the copy button's box now sits ~2.8px below the visible pill (was ~15px of container gap). Both tap targets remain a full 44px. No change to the Source-only alert, which keeps its place directly above the capsule.

Files: src/components/clinical-dashboard/answer-content.tsx (two className changes on the answer stack container and the capsule group).

Verification

  • npm run verify:pr-local
  • npm run verify:ui when UI, routing, styling, browser behavior, reduced-motion, or forced-colors behavior changed
  • npm run verify:release before release or handoff confidence claims

Same environment constraints as #678 (pinned Playwright browser build not installed; @axe-core/playwright dev dep missing), so I verified against the live npm run ensure dev server with the pre-installed Chromium: measured the capsule (44.0px hit / 26.5px face) and the copy button (44.0px) bounding boxes — both touch targets pass, and the copy row now sits ~2.8px under the pill. eslint clean on the changed file.

Clinical Governance Preflight

Presentational spacing only (margin/space-y on the answer layout); no change to ingestion, retrieval, answer generation, source data, metadata, or governance behaviour. The properties below remain unaffected:

  • Source-backed claims still require linked source verification before clinical use
  • No patient-identifiable document workflow was introduced or expanded without explicit governance approval
  • Supabase target remains Clinical KB Database (sjrfecxgysukkwxsowpy)
  • Service-role keys and private document access remain server-only
  • Demo/synthetic content remains clearly separated from real clinical sources
  • Source metadata, review status, and outdated/unknown-source behavior remain conservative
  • Deployment classification/TGA SaMD impact was checked when clinical decision-support behavior changed (n/a — no decision-support behaviour changed)

Notes

  • The -mb-2 lets the two 44px tap targets' transparent edges overlap slightly so the visible controls read closer together; the visible pill and copy label do not overlap.

🤖 Generated with Claude Code


Generated by Claude Code

Reduce the vertical gap between the Sources capsule and the "Copy with
sources" action row. The capsule and copy control each keep a 44px tap
target with small centered content, which reserved a large visible gap;
tighten the answer stack to space-y-1 and pull the capsule group down with
-mb-2 so the copy row sits directly under the pill. Tap targets are
unchanged. The Source-only alert keeps its place directly above the capsule.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01QA5WCQ6TZfumiHgu2Pjufp
@supabase

supabase Bot commented Jul 14, 2026

Copy link
Copy Markdown

This pull request has been ignored for the connected project sjrfecxgysukkwxsowpy because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.


Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

@coderabbitai

coderabbitai Bot commented Jul 14, 2026

Copy link
Copy Markdown
Contributor

Warning

Review limit reached

@BigSimmo, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 35 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 7d574c9b-fe76-4997-84f1-228b6295bca5

📥 Commits

Reviewing files that changed from the base of the PR and between b84d6a6 and 0a4cc26.

📒 Files selected for processing (1)
  • src/components/clinical-dashboard/answer-content.tsx
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch claude/source-button-styling-iyba2y

Comment @coderabbitai help to get the list of available commands.

@BigSimmo
BigSimmo marked this pull request as ready for review July 14, 2026 19:18
@BigSimmo
BigSimmo enabled auto-merge July 14, 2026 19:18
@BigSimmo
BigSimmo merged commit 72b216a into main Jul 14, 2026
16 checks passed
@BigSimmo
BigSimmo deleted the claude/source-button-styling-iyba2y branch July 17, 2026 05:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants