Grid-A-Licious icon indicating copy to clipboard operation
Grid-A-Licious copied to clipboard

Made Grid-a-licious more responsive

Open mjcampagna opened this issue 13 years ago • 1 comments

I made a few changes to the script to make it more responsive by eliminating the JS 'width' and 'gutter' options, and fetching the information dynamically from CSS. Works with media queries too.

CHANGES: - removed 'gutter' and 'width' options - script now fetches outer-width and margins from CSS and calculates grid dynamically. - accepts media queries. - example styling:

 .item {
    float: left;
    margin: 0 8px 24px;
    padding: 8px;
    width: 250px;
    }

@media only screen and (max-width: 600px) {
    .item {
        width: 150px;
        }
    }

This update to the script also resolves the other issues I've filed, btw.

mjcampagna avatar Oct 19 '12 13:10 mjcampagna

This is pretty cool. Is this going to be pulled anytime? Otherwise, could you maybe revise it to work with the version 3.0.1?

lukasoppermann avatar Jun 19 '13 09:06 lukasoppermann