Posts made by Urs Hunkler

Picture of Core developers

To get well structured theme directories with the advantage to easily know where to look for certain files is wise to propose and use for the Moodle 2.0 themes.

To restrict file linking to images, CSS and JavaScript files to one predefined directory as done in Moodle 2.0 does not help at all - in the opposite it is destructive to our theme design work.

I want to port the "plugin" structure I have developed for my themes to Moodle 2.0. One "plugin" covers a certain topic and contains all CSS, images, JavaScript etc. necessary for this topic in one folder. To use this topic in different themes means to copy the "plugin" folder to another theme and activate it - that's all. With the given Moodle 2.0 theme folder restrictions I can forget the "plugins" and their advantages.

Because I want to continue working with "plugins" I can not accept these restriction. I searched for workarounds - with different success:

  • JavaScript was easy - adding "../" and the new path to the array in the theme config file does the trick like $THEME->javascripts[] = '../' . $differentpath . '/modernizr-1.6.min';
  • CSS gave some issues. adding "../" and the new path to the array in the theme config like $THEME->sheets[] = '../' . $differentpath . '/test'; works in production mode but not in design mode. Moodle strips all path related characters from the given name in design mode. I hacked "styles_debug.php" to deliver CSS in design mode correctly from other directories in the theme folder. For my development installation this solution I can live with for now.
  • Images I could not find any workaround for using the great Moodle file caching system. The only way around for me is to deliver the images directly with a CSS rule like "background: #fcfcfc url('custom:themedirurl/themename/differentpath/img/noise.png'); and a function for "csspostprocess" to replace custom:themedirurl with the URL to the theme folder. Quite bad, isn't it?

To solve the image issue would be quite easy just by adding one condition to the "resolve_image_location" function in the outputlib to set the theme directory as base instead of the pix directory. No existing theme would be touched.



            if ($imagefile = $this->image_exists("$this->dir/pix/$image")) {
                return $imagefile;
            }
            // start change uh 2010-11-22
            if ($imagefile = $this->image_exists("$this->dir/$image")) {
                return $imagefile;
            }
            // end change uh

Please remove these restrictions within theme folders in Moodle 2.0. They make no sense, as far as I see. But they are a huge annoyance for experienced theme designers.

Average of ratings: Useful (3)
Picture of Core developers

Moodle CSS lays a font fundament with the well thought YUI CSS reset and YUI CSS fonts rules. YUI has investigated some effort to make text look more similar on the different browsers. When you have a look at YUI 3: CSS Fonts you may see what I mean. These font rules are set on the body tag.

When in any theme font related definitions are assigned to the body tag the base system breaks - as done in "text.css" in canvas for example. Many advantages using the YUI CSS font rules are thrown away.

To keep the advantages add font related rules to a subsequent element like "div#page" in all themes. On the above mentioned web page YUI publishes a table on font size values you can use to set certain text sizes - working the same in many different browsers out of the box.

By removing the font-size from the body tag and setting the font size in text.css in the canvas theme to "font-size: 108%" for "#page" I verified that the expected 14px font size in the themes are set.

So please keep the font handling advantage given with the YUI CSS system and add your rules to a subsequent element. Patrick, would you mind to correct the CSS rule in canvas?

Average of ratings: Useful (1)
Picture of Core developers

Moodle 2.0 themes are a whole new world. When I started to investigate more in Moodle 2.0 I felt close to having never worked with Moodle before.

The all different theme structure, files and CSS demand intensive exploration. Looking at existing themes, mainly the base and canvas theme, becomes important.

To be able to understand the applied CSS rules is an important base to be able to write well functioning CSS in my themes. To be able to understand CSS rules I need to be able to read the existing CSS. The one line CSS rules in base and canvas are horrible to read. It takes time to convert them to a readable format - and that work needs to be done after each theme update.

Sam opened the tracker issue MDL-22351 - but nothing happened. In an old posting Sam writes that time is lacking. To take the CSS trough one of the several CSS beautifiers takes an hour or so. If this work would be done once for Moodle core Moodle CSS would become so much easier to understand out of the box.

The chance that well working CSS without unnecessary overwrites will be written will increase with good readable Moodle base CSS. So please someone convert the CSS to a readable format.

Average of ratings: Useful (4)
Picture of Core developers

When Moodle would offer defined layout pages (1, 2 or how many may be necessary) which are used only for admin and settings pages, your approach and the admin theme approach could easily be implemented.

But I did't see the consequent implementation of layouts used only for admin/settings pages. May be the problems discovered lately and the work Sam is doing leads to rethinking and implementing these layouts.