Skip to content

fix: Alignment issues with 'unsaved changes' badge in Feature modal#6949

Open
alveyworld wants to merge 1 commit intoFlagsmith:mainfrom
alveyworld:main
Open

fix: Alignment issues with 'unsaved changes' badge in Feature modal#6949
alveyworld wants to merge 1 commit intoFlagsmith:mainfrom
alveyworld:main

Conversation

@alveyworld
Copy link

Thanks for submitting a PR! Please check the boxes below:

  • 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 issue #6935

In the .unread selector, simply changing the bottom attribute to a positive 9px brought the * badge up to vertical center without moving the position or size of the tab.

How did you test this code?

Steps to reproduce

  1. Open any feature (Edit Feature modal)
  2. Click on the "Segment Overrides" tab
  3. Make a change to a segment override (toggle enabled, change value, etc.) — the purple * badge appears
  4. Observe the badge is now vertically centered and not overlapping the baseline of the tabs
  5. Switch to "Identity Overrides" tab — the badge still shows under the now-inactive "Segment Overrides" tab

I followed these steps to recreate and visually fixed the css issue. I resized the window to extreme small and large sized and the badge remained in place. At smaller sizes it naturally jumps up to the right of the tab.

@alveyworld alveyworld requested a review from a team as a code owner March 13, 2026 23:13
@alveyworld alveyworld requested review from kyle-ssg and removed request for a team March 13, 2026 23:13
@claude
Copy link

claude bot commented Mar 13, 2026

⚠️ Code review skipped — your organization's overage spend limit has been reached.

Code review is billed via overage credits. To resume reviews, an organization admin can raise the monthly limit in Settings → Usage.

Once credits are available, reopen this pull request to trigger a review.

@vercel
Copy link

vercel bot commented Mar 13, 2026

@alveyworld is attempting to deploy a commit to the Flagsmith Team on Vercel.

A member of the Team first needs to authorize it.

@github-actions github-actions bot added the front-end Issue related to the React Front End Dashboard label Mar 13, 2026
@matthewelwell matthewelwell changed the title Update _utils.scss fix: Alignment issues with 'unsaved changes' badge in Feature modal Mar 16, 2026
@vercel
Copy link

vercel bot commented Mar 16, 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 Mar 16, 2026 7:05am
flagsmith-frontend-staging Ready Ready Preview, Comment Mar 16, 2026 7:05am
1 Skipped Deployment
Project Deployment Actions Updated (UTC)
docs Ignored Ignored Preview Mar 16, 2026 7:05am

Request Review

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

front-end Issue related to the React Front End Dashboard

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant