Skip to content

Conversation

@fi3ework
Copy link
Member

UI broken on https://rspack.rs/ and all other rstack sites.

Google Chrome 2026-01-14 14 24 42
  • Fix Ant Design 6 popover white border in dark mode by resetting .ant-popover-container styles
    • Ant Design 6 introduces a new .ant-popover-container layer, which has a default white background and shadow.
    • In dark mode, this white background creates a visual problem of a "white border."
      • Our fix:
          1. Set background-color: transparent; box-shadow: none; on .ant-popover-container to remove the white background and shadow.
          1. Manually add the shadow back to .ant-popover-content to maintain the visual effect. Previously, it was not necessary to manually write box-shadow because Ant Design 5 did not have this extra container layer, and the shadow was directly on the content layer.
  • Add Chromatic CI workflow for visual regression testing
  • Add @storybook/test for interaction testing with play functions
  • Add expanded state stories (NavIconStoryExpanded, NavIconStoryExpandedDark) with click simulation
  • Add AGENTS.md with project coding guidelines

now visual diff works on Chromatic https://www.chromatic.com/test?appId=696728d1bd37a962a7f22c4b&id=6967359abb77a1e9f9b073ee to prevent regression.

image

Copy link
Member

@chenjiahan chenjiahan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cool 👍

@chenjiahan chenjiahan merged commit da26c90 into main Jan 14, 2026
6 checks passed
@chenjiahan chenjiahan deleted the fix-ui branch January 14, 2026 08:53
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.

3 participants