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

.notification.is-dark.is-dark in official css #3911

Open
fmp777 opened this issue Sep 26, 2024 · 0 comments
Open

.notification.is-dark.is-dark in official css #3911

fmp777 opened this issue Sep 26, 2024 · 0 comments

Comments

@fmp777
Copy link

fmp777 commented Sep 26, 2024

Overview of the problem

This is about the Bulma CSS framework
I'm using Bulma version [1.0.2]
This is a Sass issue: I'm using version [1.0.2]
I am sure this issue is not a duplicate

Description

It would seem there's a sass issue with .notification - as I can't think of any reason why we need .is-dark.is-dark which basically makes the text in a dark notification invisible.

As can be seen in https://cdn.jsdelivr.net/npm/bulma@latest/css/bulma.css

.notification.is-light.is-light {
  --bulma-notification-background-l: 90%;
  --bulma-notification-color-l: var(--bulma-light-light-invert-l);
}
.notification.is-light.is-dark {
  --bulma-notification-background-l: 20%;
  --bulma-notification-color-l: var(--bulma-light-dark-invert-l);
}
.notification.is-dark.is-light {
  --bulma-notification-background-l: 90%;
  --bulma-notification-color-l: var(--bulma-dark-light-invert-l);
}
.notification.is-dark.is-dark {
  --bulma-notification-background-l: 20%;
  --bulma-notification-color-l: var(--bulma-dark-dark-invert-l);
}

Steps to Reproduce

Make a notification with just is-dark and you'll see the inner text is also dark.
https://codepen.io/fmp777/pen/BaXNoVg

You probably don't want any of the classes noted above?

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

No branches or pull requests

1 participant