Version 7 - TODO

[trykickoff]

Version 7 - TODO

[ashleynolan]

We use polyfill.io for our polyfills now - relies on an 3rd party CDN but we have a fallback shim script in case it ever were to go down. Has the benefit of only ever serving up what is needed for the particular browser the user is using, so for latest chrome (and other new browsers) it’s extremely lightweight.

[ashleynolan]

I’m down with all of it – only thing I’d probably change is to drop IE8 support in Kickoff, but keep it in the generator as an option possibly?

In regard to the block grids, I’ve updated them on a current project to use Flexbox, which is pretty straightforward to do – I can make a branch for this to see what you think (I can do this next week, as I’m putting some time aside in work to do Statix and Kickoff stuff in the next couple of weeks). If we want to move completely away from the current grid (is there a need to do this?), I think we should probably take a look at a few other options as well and see which ones we prefer.

Rest of the list looks good though – sorry I’ve been a bit unreliable the last few weeks. Been meaning to take a look at a few things but wedding planning took over temporarily after the engagement!

[mrmartineau]

Have a look at suitcss/components-grid, it actually has many features that covers both block-grids and the standard grid, and then some. [EDIT] There's a demo of the grid here: http://suitcss.github.io/components-grid/test/

As for dropping IE8, I think its time now. We could keep it in the generator as we currently do, but I'd even argue to get rid of it entirely. As a fallback, we could provide instructions on the trykickoff.com site to show how support could be added.

[mrmartineau]

SuitCSS also have suitcss/utils-flex which might be useful..test page can be found here: http://suitcss.github.io/utils-flex/test/

[mrmartineau]

@ashleynolan & @nicbell I have created some branches for flexbox (see commits) and the removal of old IE (see commits). Please review them both and, in particular, the flexbox stuff. There's a demo you can try if you checkout the code 😉

I also, creates the ES2015 branch (see commits). I'm fairly certain that everything is fine with it but it would be good to get a 2nd/3rd pair of eyes on it.

Cheers guys

[mrmartineau]

Regarding the removal or replacement of Grunticon: I have been using SVG sprites a lot recently and feel that they are a perfect replacement.. Find out more at https://css-tricks.com/svg-sprites-use-better-icon-fonts/ and you can see them in use on my site. Also, its worth noting that this technique basically inlines the SVGs which means they can be styled with CSS (e.g. colour change on :hover).

Two grunt plugins for generating SVG sprites from a folder full of SVGs are:

• https://www.npmjs.com/package/grunt-svgstore
• https://www.npmjs.com/package/grunt-svg-symbols

Let me know what you think.

[ashleynolan]

Re an image solution to replace Grunticon – I would lean towards not including an image solution at all (except tasks for minifying images and SVGs perhaps).

I think every project is completely different and every dev approaches images in very different ways, so as long as we make it easy for people to add a solution in (and make that clear), that’s the most important thing. I think this is especially true at the moment with HTTP2 just around the corner (or here right now for most people), which will make spriting and using data-uri’s much less important.

Thoughts?

[mrmartineau]

ES2015 & ESLINT have been merged into next branch now (see commits :)

[ashleynolan]

🍻 🎉

[nicbell]

Now I wont have to remove grunt icon every time. Been using grunt-svgstore successfully on a project and fairly happy with the results.

[mrmartineau]

@nicbell that's interesting. Do you think Kickoff have an icon solution? Even if its only in the generator?

[mrmartineau]

Removal of old IE stuff has now been merged into next see commits

[ashleynolan]

I’ve merged in the grid changes and have removed Grunticon – would be worth taking a look through and make sure I’ve caught all the references though.

That’s almost all the checklist done! 🚀

[mrmartineau]

I think the only thing left to do is to merge all changes into the yeoman generator.. and double-check everything else..

[ashleynolan]

Awesome 👍 I’m a bit pre-occupied this week as I’ve got a talk to finish by Friday, but reckon should be more than possible to test and release the new version by the end of next week? Sound like a plan?

[nicbell]

Now that we are using Babel, we should consider, https://babeljs.io/#polyfill instead of shimly.

Shimly does have the benefit of only shipping polyfills to old browsers. This could be solved by having more than one JS build with Babel. Two builds also means modern browsers could have different presets using more native features rather than transpiled code. Thoughts?

[mrmartineau]

@nicbell yes, I agree. Can you see if it can be easily integrated into Kickoff?

[jpdriver]

@nicbell @mrmartineau not sure about browserify but integration looks super easy with webpack 😄

With webpack.config.js, add babel-polyfill to your entry array:

module.exports = {
   entry: ['babel-polyfill', './app/js']
};

[mrmartineau]

Polyfill.io looks amazing. Do we remove shimly in place of this?

[ashleynolan]

Yeh, the way we do it is to hit the CDN, test if the script is returned and if it doesn’t for whatever reason, we load in a local script with a bunch of polyfills (we just save down a minified polyfill.io script with the polyfills we need switched on like this).

It’s a really nice service though – and it’s used on some large-scale sites so the chances of it ever going down are pretty slim.

[mrmartineau]

@nicbell has already removed shimly. @ashleynolan would you be able to add your test and fallback to a gist?

[ashleynolan]

Yeh, we’re re-working this part at the moment (as the script we used was a bit cumbersome), but I’ll add it in once that’s done.

[ashleynolan]

Where are we on the v7 release? Don’t think the fallback stuff needs to go in for release (can add that as a point release). Are there any other changes that need to be made now?

[mrmartineau]

It needs testing by everyone again. Would @nicbell, @munkychop, @jpdriver, @tommaton and anyone else please test the next branch? See the changelog for all the updates.

Also, Statix in the generator needs to be updated, no?

[ashleynolan]

Probably – I’ll check it out today and see what needs updating in there

[munkychop]

@mrmartineau I'm not able to use Kickoff much at the moment, but hoping to do so in the near future

[mrmartineau]

v7 pushed! 🎉