Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix display issues of close button in contextual light and dark modes #41126

Merged
merged 4 commits into from
Dec 31, 2024

Conversation

julien-deramond
Copy link
Member

@julien-deramond julien-deramond commented Dec 29, 2024

Caution

Before merging, close-button.md modifications must be reverted

Description

Following up the PR for the carousel display issues in contextual light and dark modes at #40695, this PR also fixes the same kind of filter issue.

This PR will close #39765.

The light in dark mode doesn't work in the main branch:

Screenshot 2024-12-29 at 21 31 26

The idea is to rely on custom properties so that there's never a specificity issue when nesting color modes (light mode in dark mode, and dark mode in light mode) (see more info in #40695)

/cc @louismaximepiton

Type of changes

  • Bug fix (non-breaking change which fixes an issue)

Checklist

  • I have read the contributing guidelines
  • My code follows the code style of the project (using npm run lint)
  • (N/A) My change introduces changes to the documentation
  • (N/A) I have updated the documentation accordingly
  • (N/A) I have added tests to cover my changes
  • All new and existing tests passed

Live previews

Related issues

Closes #39765

@julien-deramond julien-deramond marked this pull request as ready for review December 29, 2024 20:39
@julien-deramond julien-deramond requested a review from a team as a code owner December 29, 2024 20:39
@julien-deramond julien-deramond force-pushed the main-jd-close-button-dark-theme branch 2 times, most recently from 2a67d59 to 577dcb0 Compare December 29, 2024 20:49
@julien-deramond julien-deramond force-pushed the main-jd-close-button-dark-theme branch from 577dcb0 to 761d57e Compare December 29, 2024 20:59
Copy link
Member

@louismaximepiton louismaximepiton left a comment

Choose a reason for hiding this comment

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

The only regression I can see here is for people overriding directly --bs-btn-close-white-filter and not the Scss variable. I think that this patch is more asked than the workaround I underline here. I'm fine with the changes.

@julien-deramond
Copy link
Member Author

The only regression I can see here is for people overriding directly --bs-btn-close-white-filter and not the Scss variable. I think that this patch is more asked than the workaround I underline here. I'm fine with the changes.

I forgot to mention it in the description, you're right. I don't think that the override of --bs-btn-close-white-filter is used (or except maybe as a workaround for this bug), so it should be safe to land as is.
I'll update this PR to remove the modifications done on the Markdown file for testing, and then merge the PR. Thanks for the review LM 🙏

@julien-deramond julien-deramond merged commit a5d430d into main Dec 31, 2024
14 checks passed
@julien-deramond julien-deramond deleted the main-jd-close-button-dark-theme branch December 31, 2024 08:09
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

Potential for contrast issues with '.btn-close' class
2 participants