Search code examples
singularitygs

What's the best way to build a multicolumn grid with minimal markup with Singularity


Let's say i have a grid of articles (2 columns), inside another column. What's the best way to achieve this without having to explicitly tell singularity on which column should the article be.

Is it the only option to declare it with pseudo classes?

article:nth-child(1n){
   @include grid-span(1,1);
}
article:nth-child(2n){
   @include grid-span(1,2);
}

Thanks.


Solution

  • There is an even shorter way than Scott aka user2242314 has suggested above::

    $grids: 12;
    $gutters: 1/3;
    
    .column {
      @include float-span(1);
    
      &:last-child {
        @include float-span(1, 'last'); }}
    

    Unfortunately, there's a bug in Singularity that prevents from using this short method, even though it's suggested by Singularity documentation.

    I've fixed the bug and submitted a pull request. Wait for Scott or Sam aka Snugug to accept it and release an updated gem (of version 1.0.7 or later). Then run gem update or bundle update and you're able to use the cleanest solution.