Skip to content

fix: Add visual divider between environment columns in comparison view#7250

Draft
talissoncosta wants to merge 2 commits intomainfrom
fix/compare-env-divider-7249
Draft

fix: Add visual divider between environment columns in comparison view#7250
talissoncosta wants to merge 2 commits intomainfrom
fix/compare-env-divider-7249

Conversation

@talissoncosta
Copy link
Copy Markdown
Contributor

  • I have read the Contributing Guide.
  • I have added information to `docs/` if required so people know about the feature.
  • I have filled in the "Changes" section below.
  • I have filled in the "How did you test this code" section below.

Changes

Closes #7249

In the environment comparison view, the segment override icon (pie icon) sat flush against the next environment's column, making it hard to visually separate where one environment ends and the next begins.

This PR adds a left border and small padding to the right environment column (both header and rows) so the boundary between environments is clear.

How did you test this code?

  1. Open a project with multiple environments and segment overrides on at least one feature
  2. Navigate to `/project/{id}/compare`
  3. Select two environments
  4. Confirm there is now a visible vertical divider between the left and right environment columns
  5. Confirm the segment override icon no longer sits flush against the next column

Adds a left border and padding to the right environment column (header
and rows) so the segment override icon no longer sits flush against the
next column.

Closes #7249

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@vercel
Copy link
Copy Markdown

vercel bot commented Apr 15, 2026

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

Project Deployment Actions Updated (UTC)
flagsmith-frontend-preview Ready Ready Preview, Comment Apr 15, 2026 5:37pm
flagsmith-frontend-staging Ready Ready Preview, Comment Apr 15, 2026 5:37pm
1 Skipped Deployment
Project Deployment Actions Updated (UTC)
docs Ignored Ignored Preview Apr 15, 2026 5:37pm

Request Review

The segment and identity override icons were rendered after the value,
which placed them at the right edge of the column — visually colliding
with the next environment in the comparison view.

Move them to before the value (next to the toggle) so they belong with
the env-specific controls and stay clear of column boundaries.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

fix front-end Issue related to the React Front End Dashboard

Projects

None yet

Development

Successfully merging this pull request may close these issues.

UI: Add visual divider between environment columns in comparison view

1 participant