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

Message body lost it background if parent use has/is-background-white #3775

Closed
lorrydriveloper opened this issue Apr 5, 2024 · 2 comments · Fixed by #3860
Closed

Message body lost it background if parent use has/is-background-white #3775

lorrydriveloper opened this issue Apr 5, 2024 · 2 comments · Fixed by #3860

Comments

@lorrydriveloper
Copy link

This is about Bulma.

Having a parent with class background change the behavior of the children's messages body as the variable
now points to

[class*=has-background-white], [class*=is-background-white] {
    ...other code
    --bulma-background-l: var(--bulma-white-l);
}

that change the

.message-body {
    background-color: hsl(var(--bulma-message-h), var(--bulma-message-s), var(--bulma-message-background-l));
}

that point to

--bulma-message-background-l: var(--bulma-background-l);

Overview of the problem

I'm using Bulma version [1.0]

Description

Not sure if it is a bug or an overview, but even in the docs, the class is used. but not having the desired effect anymore.

Steps to Reproduce

Add has-background-white to any parent where a message is displayed.

Expected behavior

Screenshot 2024-04-05 at 12 19 25

Actual behavior

Screenshot 2024-04-05 at 12 19 40
@tonprince
Copy link
Contributor

I have the same issue when using a message within modal overlay. The message color is inherited from the parent.


<div class="modal">
  <div class="modal-background"></div>
  <div class="modal-content">
    <article class="mt-5 message is-danger is-6">
              <div class="message-body">
                 Test
              </div>
            </article>
  </div>
</div>

@sheenagibbs
Copy link

I'm struggling with this same issue. Is there any fix or quick workaround? Or do I just need to manually fix it?

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 a pull request may close this issue.

3 participants