View Issue Details

IDProjectCategoryView StatusLast Update
0002095Composrcore_themeingpublic2017-04-08 17:05
ReporterChris GrahamAssigned ToChris Graham 
Status closedResolutionduplicate 
Product Version 
Fixed in Version 
Summary0002095: Bootstrap theme
DescriptionImplement a Bootstrap theme for Composr and bundle it. Characteristics:
 - Responsive design (no mobile mode)
 - Bandwidth-heavy (but flashy)
 - Uses grid system (so not as semantic)
 - Flat design (so fewer gradients or rounded corners, use solid colours, make good use of quality modern screens)
 - More animation effects

To do this, we would first make some modernisations to the default theme to put us more in harmony with what other people are doing. Things that don't sacrifice anything, just meet some soft expectations people may have. Things like updating code styles and using more modern JavaScript. We then use this as a base to then build the Bootstrap theme, knowing fewer overrides will be needed.

Improving the default theme:
 - We can drop some compatibility. See 0002005 for some vague ideas that may be implementable in whole or part. We can Kill IE9 support, IE10 minimum. Any code in there just for IE8 and IE9 can be removed. Once stuff is done from that issue, edit it out of that issue.
 - Put Zepto in jquery_lite.js and always load it by default.
 - But if jQuery is requested, we hard-code to skip jquery_lite in the PHP code (web_resources.php)
 - We let any of our JS code use Zepto's minimal jQuery features, going as far as removing Composr JS that performs the same thing. Zepto gives us a minimal version of jQuery giving us the useful features without the bloat. We will generally write modern JS and CSS rather than relying on jQuery, but where Zepto saves significant code we would use it.
 - We support CSP (0000508) which means making a lot of new .js files and not using inline event handlers. We don't worry about having lots of individual JS files anymore, minimising request quantity is not as important as it was due to browser parallelisation improvements a decade ago and HTTP/2. So we can have downloads.js, galleries.js, etc (i.e. a separate JS file for every addon that uses JS, listed in the addon's addon_registr file).
 - We make the JS match best practices (maybe run it through code reformatters)
 - We continue to have the CSS match best practices for semantic low bandwidth sites - tweaks may be made, nothing huge (if you prefer '-' to '_' be my guest)
 - We continue to include Tempcode in JS and CSS, but we do use our comment encapsulation

 - The default theme will not be responsive, mobile mode will persist
 - Try and do in small steps to not overwhelm yourself or break the code-base. We don't want to have to delay v11 because we're still making theme changes. Ultimately we're planning most of this for v12, so at some point we'll probably decide "okay, that's enough for this version"

Then Bootstrap:
 - When we are happy the default theme has modern enough code and works to its design goals, we then clone to make a responsive Bootstrap v4 theme using the very latest Bootstrap. No mobile mode support in this theme. Support the Admin Zone also.
 - We may support native sass (scss) in Composr by shipping a compiler. If we do though, it will have to run FAST, unlike what we had with LESS. Performance testing will be required. It is critical users can run on really shitty web hosts and not do any kind of steps that touch any kind of code, yet continue to customise things in a native template editor if they wish to
 - We remove any overrides no longer needed in the bootstrap theme - probably that means almost no .js files are overridden, but almost all CSS and HTML templates are
 - In the default zones, set the bootstrap theme as the default
 - Add a question to the Setup Wizard which theme to use
 - Document the relative advantages and disadvantages of each theme in the theme documentation.

 - Going forward we maintain and ship both themes
TagsRisk: Breaks themes, Skills: Graphic design, Type: Mobile
Attach Tags
Time estimation (hours)200
Sponsorship open


duplicate of 0003206 closedSalman Next generation theme (on hold) 
related to 0000508 resolvedChris Graham Support Content Security Policy 
related to 0002798 closedChris Graham Make use of side vertical menus for responsive screens 
related to 0002912 resolvedChris Graham Hybrid responsive theme 
related to 0002966 assignedSalman Re-design icons using flat design 


Chris Graham

2016-11-09 00:51

administrator   ~0004528

For v11 we'll be doing 0002912 instead, the hybrid responsive theme. This is almost complete in a separate v10 branch, undergoing testing and tuning. We'll also be doing the JS overhaul (everything in "Improving the default theme" except the last two bullets), which is mostly completed now. We may also do some flat design work.

The thinking is that the single hybrid theme provides a best-of-both-worlds approach regarding mobile mode and responsive design, without these Bootstrap disadvantages:
 - Implementation costs
 - Complexity for themers
 - Disruption
 - Ongoing maintenance costs

Particularly I am concerned about Composr empowering people, rather than dumping an incredibly convoluted set of templates and CSS on people that they don't have the skill to customise.

A future Bootstrap theme will likely be tied to a Patreon campaign based on democratic decisions of what should be the next big development priority (Google AMP would be another contender).

Issue History

Date Modified Username Field Change
2016-06-27 19:55 Chris Graham Relationship added has duplicate 0002677
2016-07-22 15:39 Chris Graham Relationship added related to 0002005
2016-07-22 16:29 Chris Graham Relationship deleted has duplicate 0002677
2016-07-22 16:30 Chris Graham Description Updated View Revisions
2016-07-22 16:31 Chris Graham Project Composr downloadable themes => Composr
2016-07-22 16:31 Chris Graham Category General => core_themeing
2016-07-22 16:46 Chris Graham Relationship added related to 0000508
2016-07-22 16:46 Chris Graham Description Updated View Revisions
2016-08-27 23:57 Chris Graham Relationship added related to 0002798
2016-10-30 14:21 Chris Graham Relationship added related to 0002912
2016-11-09 00:51 Chris Graham Note Added: 0004528
2016-12-02 21:04 Chris Graham Relationship added related to 0002966
2016-12-08 00:19 Chris Graham Tag Attached: Skills: Graphic design
2016-12-08 18:08 Chris Graham Tag Attached: Risk: Breaks themes
2017-04-08 17:05 Chris Graham Status non-assigned => closed
2017-04-08 17:05 Chris Graham Assigned To => Chris Graham
2017-04-08 17:05 Chris Graham Resolution open => duplicate
2017-04-08 17:05 Chris Graham Relationship added duplicate of 0003206
2017-05-01 18:07 Chris Graham Relationship deleted related to 0002005