I’m updating an editor app (this one) to run with the current versions. I’m very new to Nextcloud app development, and I can’t for the life of me work out how we’re meant to handle CSS differences.
Right now, the input fields within the editor (which is entirely “light themed”, no other option) get overriden by the Nextcloud theme. So I end up with an otherwise very light app with black input fields. Also, the text color on some other elements gets overridden to be really light, which makes the app very difficult to use because the background is still white.
!important in my css is more or less the only approach I know, and it’s not doing anything. Is there a simple, self-contained solution to make the app ignore the core css ? Or a “best practice” for writing app css?
The idea is to not remove the css from the core but use it yourself.
Do never use important in app code css. This is a very bad practice. This breaks the complete system.
I cannot give you a single answer on how to dive the problem. You should understand the basics of css before fixing this.
You can always override the system css where required. I would have to look at the link of the app you provided.
If you have more precise questions, feel free to ask them.
You can always override the system css where required.
This is the entirety of my question. I understand css and I’ve done web development before. I want to know how Nextcloud conceptualizes and handles css, because it isn’t behaving as I would expect and I can’t find any resources explaining why the Nextcloud structure differs from my expectations.
There is nothing special with nextcloud related to css it works just the same as with any other web development structure.
I would like to help you but i cannot do that when I do not know what is failing that you do not expect.
If that would help you, i suggest to have a live chat/meeting to talk with each other. Or you write an example of a problem.
Another way forward could also be to use the Vue library we provide which comes with all kinds of components ready to use styled:
Nevermind, I worked it out. I’d delete the post, but I don’t have permission.
Simply mark the topic as answered.