smutek/BourbonySage

Visual Grid and breakpoints issues

matteogalli opened this issue · 1 comments

Hello, with your setup, if I add columns in _variables.scss breakpoints like this:

$small-screen-up: new-breakpoint(min-width $small-screen 2);
$medium-screen-up: new-breakpoint(min-width $medium-screen 4);
$large-screen-up: new-breakpoint(min-width $large-screen 8);
$wide-screen-up: new-breakpoint(min-width $wide-screen 12);

the visual grid doesn't change on lower resolutions (mobile, tablet, ecc), but remains 12 columns.

Can be necessary to load neat-helpers before the _variables.scss?

I am testing also Some Like It Neat Theme (an other starter theme with Bourbon+Neat) that imports the neat-helpers before grid settings ([https://github.com/digisavvy/some-like-it-neat/blob/master/assets/sass/_grid-settings.scss]) and the visual grid and breakpoints seems to work fine.

Hey Matteo,

I think this is good to go. Thanks so much for pointing this out - and for the link to Some Like It Neat.

I added a grid settings file to the theme, then set it up as an override for Bourbon in bower.json - this was the best way I could think of to get that grid-settings file, and the neat-helpers import, where they needed to be - in between the Bourbon and Neat imports, and still have the dependencies injected by wire dep.

I tested it and the visual grid seems to be working as expected.

I also added the Omega Reset mixin.

Closing this out, please have a look and re-open or let me know if I've missed anything.