CSS Class naming references or docs anywhere?

CSS Class naming references or docs anywhere?

by Tony Delahunty -
Number of replies: 1

Hi, I realise there's a wiki started on this at http://docs.moodle.org/en/index.php?title=Theme_reference&action=history but it's obviously not fully developed yet.  Is there a reference, however partial, to class naming so as to aid CSS editing for new themes.  I know the class names are pretty meaningful in Moodle anyway, so won't panic if not, but thought it worth asking..... 

Average of ratings: -
In reply to Tony Delahunty

Re: CSS Class naming references or docs anywhere?

by Urs Hunkler -
Picture of Core developers

The most up to date way to learn about and work with Moodle Themes is to use the interactive Chameleon theme together with Firefox and the FireBug extension.

How I use it:
1) Right click on the element and choose "inspect element" to see all attached CSS in FireBug.

2) Shift click on the element to get the Chameleon dialogue.

3) Click on exactly those tags which define the styling (FireBug shows them) in the Chameleon dialogue to select them.

4) Change/add the CSS with the Chameleon dialogue.

5) Save and immediately enjoy the Moodle pages with your newly set styling.

All documentation - how good it may be - can't be as actual as this method.

And FireBug shows the page structure and all attached CSS. You even can change the HTML and the CSS for short experiments on any page.

Have fun with your productive Moodle theme work.