Boiler - let's call it 0.2 - Ready for testing!

Posted by Will on 1332555309
A lot more work has gone into this version - I will highlight the major stuff here, and you can find the others as you play.

The first is that a new skin 'flow' has been added. This is a responsive skin! open up theme_settings.html and set it as the active skin to check it out.

After a lot of consideration - I have selected a 'skin first' approach instead of 'mobile first'. Typically the buzz is more for mobile first - but this is a lot of work for the end user, and in my travels - you don't typically see people restyling the whole site because of device - instead they typically tweek the design to make it work on these smaller/larger devices. So boom - "skin first responsive design" is born. Screw the preachy fanboys - it is more important to offer a simple system to our users imo. Let me know if you dig or hate.

Quite a bit of markup skeleton tweeks.

Introduced a new js api of sorts for all your javascript that stores common lookups for you. when you use a javascript selector like $('body') this performs a dom lookup, which chews up resources.

So I have added an array of common lookups for you to use in your scripts.

Here is the array:
boiler.dom = { body: $('body'), header: $('#header'), logo: $('#logo'), search: $('#header-search'), navToggle: $('#nav-toggle'), navigation: $('#primary-navigation'), page: $('#page'), preface: $('#preface_wrapper'), main: $('#main'), left: $('#leftside_wrapper'), contentZone: $('#content_wrapper'), content: $('#content'), right: $('#rightside_wrapper'), postscript: $('#postscript_wrapper'), footer: $('#footer') }


Here is an example of how to use it:
boiler.dom.navToggle.on({ click: function(e) { e.preventDefault(); boiler.dom.navigation.slideToggle('fast'); } }); boiler.dom.body.append('...'); boiler.dom.mainMenu = boiler.dom.left.find('#mainmenu'); boiler.dom.mainMenu.hide();


hmm, what else...

I have begun playing with a concatenator - this php file (boiler.php) is in the extras folder - place it in your icms root path and enable the option in theme_settings or skin_settings. Used little at this time, but it will get better over time. You could find this very useful if for example you used the extra meta file to include your own scripts. concatenate them to reduce http requests people.

One consideration I am thinking about is putting all the media queries into a single css file instead of making so many requests - this might be a little more user friendly - far less files to deal with...


There is a bunch more boring stuff, lots of gems to find for you early explorers - still no docs yet - so be brave adventurers :)

Protector won't let me upload it here, so here is a link

This Post was from: https://www.impresscms.org/iforum/viewtopic.php?topic_id=5170&post_id=46115