Nucleus framework in Antimatter: how to show two columns in mobile?

I notice that the nucleus grid always breaks down to one column for mobile. How would I go about forcing certain grids to break down into two, or more, columns on mobile? I've gotten around it using a basic table which looks OK as far as I can tell, but maybe there's a better way to do it.

Is there an extended nucleus grid classes css file out there that adds some of this kind of stuff?

That would seem to be controlled by /user/themes/antimatter/scss/nucleus/_flex.scss, which already has additional size classes for tablets: .size-tablet-1-2, .size-tablet-1-3 and so on.

Using scss, you could add classes with custom column counts for mobile like this (assuming here that 6 is the maximum amount of columns you would want to use on mobile):

--- css
body {
@include breakpoint(mobile-only) {
.size-mobile-1-2 {
@include flex(0 percentage(1/2));
}
.size-mobile-1-3 {
@include flex(0 percentage(1/3));
}
.size-mobile-1-4 {
@include flex(0 percentage(1/4));
}
.size-mobile-1-5 {
@include flex(0 percentage(1/5));
}
.size-mobile-1-6 {
@include flex(0 percentage(1/6));
}
}
}

In case you're not using scss (which I highly recommend for reasons obvious to anyone comparing the above and below code) and just want the compiled css:

--- css
@media only all and (max-width: 47.938em) {
body .size-mobile-1-2 {
-webkit-box-flex: 0;
-moz-box-flex: 0;
box-flex: 0;
-webkit-flex: 0 50%;
-moz-flex: 0 50%;
-ms-flex: 0 50%;
flex: 0 50%; }
body .size-mobile-1-3 {
-webkit-box-flex: 0;
-moz-box-flex: 0;
box-flex: 0;
-webkit-flex: 0 33.33333%;
-moz-flex: 0 33.33333%;
-ms-flex: 0 33.33333%;
flex: 0 33.33333%; }
body .size-mobile-1-4 {
-webkit-box-flex: 0;
-moz-box-flex: 0;
box-flex: 0;
-webkit-flex: 0 25%;
-moz-flex: 0 25%;
-ms-flex: 0 25%;
flex: 0 25%; }
body .size-mobile-1-5 {
-webkit-box-flex: 0;
-moz-box-flex: 0;
box-flex: 0;
-webkit-flex: 0 20%;
-moz-flex: 0 20%;
-ms-flex: 0 20%;
flex: 0 20%; }
body .size-mobile-1-6 {
-webkit-box-flex: 0;
-moz-box-flex: 0;
box-flex: 0;
-webkit-flex: 0 16.66667%;
-moz-flex: 0 16.66667%;
-ms-flex: 0 16.66667%;
flex: 0 16.66667%; } }

Thanks for the info. Yeah, I'm doing my edits in the scss files which is making things easier. I'll do some experimenting.