Moodle Mobile 2 (Ionic 1) Themes: Difference between revisions
Juan Leyva (talk | contribs) No edit summary |
Juan Leyva (talk | contribs) No edit summary |
||
Line 34: | Line 34: | ||
== Testing == | == Testing == | ||
Please, read | Please, read [[Setting up your development environment for Moodle Mobile 2]] in order to set up a local environment for testing your custom CSS file, you should also read this document: [[Moodle Mobile development using Chrome or Chromium]] | ||
Revision as of 07:48, 19 June 2015
The Mobile app can retrieve your custom styles from your Moodle site. Since is an HTML5 app, you can apply safely CSS3 styles.
In your Moodle installation go to Plugins / Web services / Mobile and enter in the mobilecssurl field a valid URL pointing to a CSS file containing your custom styles (theme).
The CSS should be placed inside your Moodle installation (in your custom theme or inside a local plugin)
Notice that on the first time a user opens the app, he will see the default "orange" style. Your custom styles will be applied once the user has added a site in the app.
Notice also that styles comes from a site, there is no way for changing the Add site / Manage account styles.
Example of a custom theme (CSS file)
.bar-side-menu { background-color: blue; } .bar-content { background-color: blue; } .button.button-positive { border-color: blue; background-color: blue; color: #fff; } .item-divider { background-color: #fafafa; }
Testing
Please, read Setting up your development environment for Moodle Mobile 2 in order to set up a local environment for testing your custom CSS file, you should also read this document: Moodle Mobile development using Chrome or Chromium
See also
http://caniuse.com/ Support tables for CSS3 styles (including Mobile browsers)