Developing for mobile using neat

Design Front End Development
1

I’m trying to develop a rails site using the thoughtbot gang, bourbon neat bitters refills, and don’t seem to understand how neat plays with refills. I set up the break points in grid settings as shown in the neat github page. However, no matter how I tried to use the break points its not working. For example, I can’t remove the margins from the cards pattern in refills for mobile. I thought it should be as simple as

@include media($mobile) {
$card-margin: 0em;
}

but without any luck!

can someone point out what I’m doing wrong?

2

You cannot change a variable value from within a media query.

@include media($mobile) {
  $card-margin: 0em;
}

Won’t work.

Something like the following will.

$card-margin-mobile: 0em;

@include media($mobile) {
  margin: $card-margin-mobile;
}
1 Like
3

Thanks Michael you solved the puzzle.