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 the color on toast, form-label, modal and card when set the data-bs-theme="dark" on the element itself #38212

Open
wants to merge 15 commits into
base: main
Choose a base branch
from

Conversation

jonnysp
Copy link
Contributor

@jonnysp jonnysp commented Mar 11, 2023

Fix the color on table, toast, form-label, modal and card when set the data-bs-theme="dark" on the element itself

and fix the theme switcher in some examples

Description

Motivation & Context

Type of changes

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

Checklist

  • I have read the contributing guidelines
  • My code follows the code style of the project (using npm run lint)
  • I have added tests to cover my changes
  • All new and existing tests passed

Live previews

Related issues

@jonnysp jonnysp requested a review from a team as a code owner March 11, 2023 18:04
@jonnysp jonnysp changed the title Update _variables.scss Fix the color on modal and card when set the data-bs-theme="dark" on the element itself Mar 11, 2023
@jonnysp jonnysp changed the title Fix the color on modal and card when set the data-bs-theme="dark" on the element itself Fix the color on form-label, modal and card when set the data-bs-theme="dark" on the element itself Mar 13, 2023
@jonnysp jonnysp changed the title Fix the color on form-label, modal and card when set the data-bs-theme="dark" on the element itself Fix the color on toast, form-label, modal and card when set the data-bs-theme="dark" on the element itself Mar 14, 2023
@jonnysp jonnysp changed the title Fix the color on toast, form-label, modal and card when set the data-bs-theme="dark" on the element itself Fix the color on toast, form-label, modal and card when set the data-bs-theme="dark" on the element itself and fix the theme switcher in some examples Mar 14, 2023
@mdo
Copy link
Member

mdo commented Mar 14, 2023

This breaks light mode card variants:

I also don't see a problem in the before state for stuff like form labels and toasts. Do you have screenshots of intended before/after to better show what needs addressing and reviewing here?

@jonnysp
Copy link
Contributor Author

jonnysp commented Mar 15, 2023

ok i fixed the card variants

for Card

data-bs-theme="dark" on card itself

before
grafik

after
grafik

@jonnysp
Copy link
Contributor Author

jonnysp commented Mar 15, 2023

for Toasts

data-bs-theme="dark" on toast itself

before
grafik

after
grafik

@jonnysp
Copy link
Contributor Author

jonnysp commented Mar 15, 2023

dropdown example

dark dropdown without any other change to the light dropdown only the data-bs-theme="dark" on itself

this fixes the dark preview

https://deploy-preview-38212--twbs-bootstrap.netlify.app/docs/5.3/examples/dropdowns/

before
grafik

after
grafik

@jonnysp
Copy link
Contributor Author

jonnysp commented Mar 15, 2023

for Popover

data-bs-theme="dark" on Popover itself

before
grafik

after
grafik

@jonnysp jonnysp changed the title Fix the color on toast, form-label, modal and card when set the data-bs-theme="dark" on the element itself and fix the theme switcher in some examples Fix the color on table, toast, form-label, modal and card when set the data-bs-theme="dark" on the element itself and fix the theme switcher in some examples Mar 15, 2023
@jonnysp
Copy link
Contributor Author

jonnysp commented Mar 15, 2023

for Labels and Floating labels

data-bs-theme="dark" on parent (form) or element itself

before
grafik

after
grafik

@jonnysp
Copy link
Contributor Author

jonnysp commented Mar 15, 2023

on accordion, alert, modal, pagination, listgroup, progress the data-bs-theme="dark" already works

@jonnysp jonnysp force-pushed the theme-dark-on-card-and-modal-fix branch from 32692e9 to 61471d0 Compare April 26, 2023 08:50
This reverts commit 61471d0.
@jonnysp jonnysp changed the title Fix the color on table, toast, form-label, modal and card when set the data-bs-theme="dark" on the element itself and fix the theme switcher in some examples Fix the color on toast, form-label, modal and card when set the data-bs-theme="dark" on the element itself and fix the theme switcher in some examples Apr 26, 2023
@jonnysp
Copy link
Contributor Author

jonnysp commented Apr 26, 2023

Removed the tables change is fixed by #37084.

@jonnysp
Copy link
Contributor Author

jonnysp commented Apr 26, 2023

fix for example pages in a new pull request #38512

@jonnysp jonnysp changed the title Fix the color on toast, form-label, modal and card when set the data-bs-theme="dark" on the element itself and fix the theme switcher in some examples Fix the color on toast, form-label, modal and card when set the data-bs-theme="dark" on the element itself Jun 1, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants