Excellent, really glad to see a solid plan for this, I think it's a really important piece of work.
I think you've captured the essence of what I had in mind when we discussed the element library at the hackfest in Perth. Having a really robust set of elements to work with will make development and theming easier, and allow the work needed to meet Moodle's many requirements (responsive design, multi-lingual, accessible, progressive JS enhancement, etc) to be centrally managed. It will also help consolidate the overall UI to improve consistency.
Some thoughts:
- Without wanting to instantly double to scope of this work (really!), I just wanted to mention templates. Given the scope of work needed to rewrite existing renderers has there been any consideration of integrating a template engine like TWIG? This could provide improved XSS protection and help enforce the separation of style from content, provide better support for layout changes in themes and make it easier for non-programmers to write/edit themes.
- I agree that the lack of a connection between a renderer's HTML and accompanying CSS is a problem. Do you have a plan in mind for how that could be overcome?
- It would be nice to use a convention for classes/ids that have been added for use via JS, so you can easily tell if it is safe to change something or if it is being used for JS.
- You talk about the fact that bootstrap specific classes are included in renderers, and about the idea of making things CSS framework agnostic. If I've understood correctly you are achieving that by inserting the classes required by the framework into the renderer as required (approaches A and B). That seems quite complex, and I'm not 100% convinced there is sufficient payoff as opposed to just standardising on a single framework (like using YUI for JS). Is there a huge demand from themers to be able to use different frameworks?
- It would be good for the style guide to recommend a standard layout for similar pages. For example, it's really common to have a page with a list of items and a "create new item" option. It would be great if the style guide recommended the "create new item" was a button and it should be positioned above and to the right of the list of items. Even better would be a renderer that could be used for any type of items where the developer just provides the elements/components. That way a theme designer could override the renderer and have it change everywhere.
- I'm a bit concerned that aiming for full backward compatibility may limit the scope of what you can achieve.
Simon