The CSS file of the app will always be loaded first. That file is applied to the whole app, while yours will only be applied when your site is loaded.
Hi Dani,
Probably really thick questions, but I'm new to CSS and the mobile App customisation.
I've already got a copy of Main.css and I've been looking through it.
My present understanding is;
1) When accessing moodle via a browser, it uses main.css to outline the formatting of the whole site.
2) when accessing via the moodle app, it uses main.css initially, then over rides this with whatever custom .css I reference in the mobilecssurl field (lets call this custom.css going forward)
So, in my custom.css Do i need to include the whole of main.css, or just the bits which are different?
Also, Is there any where i can find a listing of what the objects are called in moodle? for instance, main.css references ".ion-ios-baseball-outline" (see line 254) I understand the ios reference, however I'm pretty sure I've never seen a baseball anywhere in moodle!? If not detailed, just main section naming conventions would be awesome as it would eliminate a lot of trial and error.
Hi Chris,
the main.css file I sent above is only for the app, not for browser. In browser the theme in your Moodle site will be applied. They are different, the CSS of the site doesn't apply to the app and the other way around.
The point 2 is correct. You only need to include the parts you want to modify.
We don't have any list of objects for the app. The example you provided is part of the Ionic CSS, it isn't used in the app. Ionic is the framework we use to build the mobile app.
You can find a bit more info in here:
https://docs.moodle.org/dev/Moodle_Mobile_Themes
In general I recommend you to use the webapp to run the app, inspect the elements you want to modify and check which classes and styles they currently have.
Cheers,
Dani
Hello everyone, everything good?
When I change my app's css and ionic coils the code and updates the project it disregards all my modifications and when I vote for the code it goes the same way, nothing changes, but when I update the code it comes back as it was before . Someone help me ?