Comments (27)
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.
from kickoff.
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!
from kickoff.
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.
from kickoff.
SuitCSS also have suitcss/utils-flex which might be useful..test page can be found here: http://suitcss.github.io/utils-flex/test/
from kickoff.
@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
from kickoff.
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:
Let me know what you think.
from kickoff.
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?
from kickoff.
ES2015 & ESLINT have been merged into next branch now (see commits :)
from kickoff.
🍻 🎉
from kickoff.
Now I wont have to remove grunt icon every time. Been using grunt-svgstore successfully on a project and fairly happy with the results.
from kickoff.
@nicbell that's interesting. Do you think Kickoff have an icon solution? Even if its only in the generator?
from kickoff.
Removal of old IE stuff has now been merged into next see commits
from kickoff.
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! 🚀
from kickoff.
I think the only thing left to do is to merge all changes into the yeoman generator.. and double-check everything else..
from kickoff.
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?
from kickoff.
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?
from kickoff.
@nicbell yes, I agree. Can you see if it can be easily integrated into Kickoff?
from kickoff.
@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']
};
from kickoff.
Polyfill.io looks amazing. Do we remove shimly in place of this?
from kickoff.
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.
from kickoff.
@nicbell has already removed shimly. @ashleynolan would you be able to add your test and fallback to a gist?
from kickoff.
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.
from kickoff.
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?
from kickoff.
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?
from kickoff.
Probably – I’ll check it out today and see what needs updating in there
from kickoff.
@mrmartineau I'm not able to use Kickoff much at the moment, but hoping to do so in the near future
from kickoff.
v7 pushed! 🎉
from kickoff.
Related Issues (20)
- kickoff-react HOT 2
- Docs site down HOT 4
- Kickoff 8 checklist HOT 20
- Fix SVG minification HOT 3
- Finalise SVG sizing & correct CSS workflow
- Form themes HOT 1
- Hot module reloading HOT 1
- Production build requires optional dependencies HOT 5
- Generated CSS file not respect the name given in config.js HOT 1
- Kickoff Builds HOT 3
- problem with current grunt-contrib-imagemin version in package.json HOT 7
- When selecting statix in Yeoman generator missing comma in Gruntfile HOT 1
- Issue with grunt-icon/NPM, causing error HOT 1
- Remove Placeholder Mixin
- Moving to Gulp HOT 1
- KO FlexGrid HOT 11
- Broken link in Docs HOT 1
- Error in styleguide.scss HOT 3
- IE11 Printing Issue HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from kickoff.