bulma
bulma copied to clipboard
Message body lost it background if parent use has/is-background-white
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
Actual behavior
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>