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

Bulma conflicting with Tailwind classes #9973

Open
hassnian opened this issue Apr 4, 2024 · 7 comments
Open

Bulma conflicting with Tailwind classes #9973

hassnian opened this issue Apr 4, 2024 · 7 comments
Labels
$ ~<50usd css intern tasks intended for internal team p2 core functionality, or is affecting 60% of app

Comments

@hassnian
Copy link
Contributor

hassnian commented Apr 4, 2024

checked and the important heremd:!my-0 seems to be needed.
but the others w-full h-[1px] md:w-[1px] md:h-[13px] seem to work as expect without !
pls remove any important if they are not needed.

It's not needed if there is only tailwind, but now there are some side effects from Bulma styles.. It dose not work as expected without !

yep I'm aware of that, it's pretty annoying, I've encounter those pretty often when adding anymargin or padding class , it forces you to use ! otherwise it ends up using the bulma class.

conflicting

  • padding
  • margin
  • container
  • and probably much more

Originally posted by @hassnian in #9964 (comment)

@hassnian hassnian added the css label Apr 4, 2024
@yangwao yangwao added $ ~<50usd p2 core functionality, or is affecting 60% of app labels Apr 4, 2024
@daiagi
Copy link
Contributor

daiagi commented Apr 11, 2024

this is larger then it may seem

removing bulma/helpers/spacing is simple

but doing so breaks style in subtle ways

it will require going page by page and over all Neo components to make sure all stays in place

@leo-1228
Copy link

leo-1228 commented May 9, 2024

👋

@daiagi
Copy link
Contributor

daiagi commented May 10, 2024

@leo-1228

i recommend you start with other, smaller issue
this one is big and not a good choice as first issue

@leo-1228
Copy link

I know, But, i will do my best for our project.

@leo-1228
Copy link

I checked all components and pages and removed unnecessary !,I tried to send pull request but it did not work.
I think it is because changed codes is not so much to merge.
image
I am waiting for your reply.

@daiagi
Copy link
Contributor

daiagi commented May 13, 2024

that is not the point of the issue

by removing ! margins have changed

the ! is there to force tailwind style over bulma, without it bulma takes over. and that is the undesired behavior

to solve this it will require
a. very selectively import bulma sass files (instead of importing all of them as it is now)
b. slowly and carefully fixing all the broken styles that will popup

i am marking internal-only
i appreciate your time spent on this @leo-1228 . but this is task is not suitable for first time

@daiagi daiagi added the intern tasks intended for internal team label May 13, 2024
@leo-1228
Copy link

ok, daiagi, sorry for failing my first contribute for our project. Now, I am going to try fixing another issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
$ ~<50usd css intern tasks intended for internal team p2 core functionality, or is affecting 60% of app
Projects
None yet
Development

No branches or pull requests

4 participants