Grid without breakpoints

[doktorbro]

What about give the user really pure grids without breakpoints inside? Instead I’d like to define my own breakpoints in the header of page:

<link rel="stylesheet" media="(min-width: 0)" href="grid-small.css" />
<link rel="stylesheet" media="(min-width: 30em)" href="grid-medium.css" />
<link rel="stylesheet" media="(min-width: 60em)" href="grid-large.css" />

The grid-medium.css should only contain the medium units:

.pure-u-medium-1,
.pure-u-medium-1-2,
.pure-u-medium-1-3,
/* … */
{

}

Do you think that way is possible in feature?

[narcis-radu]

isn't this the same? #267

[ericf]

@penibelst Yup, exactly! We're working on it and building the tooling and updating the website to make it easy to customize Pure Grids with your app's specific breakpoints.

@narcis-radu it is the same, but we'll leave this open until #267 is merged.

[doktorbro]

@ericf @narcis-radu Great news. Can’t wait to use it. I close this one and subscribe to the duplicate.

[ericf]

@penibelst You can start using the CLI today. We have a first version of a Rework plugin that generates custom grid unit sizes along with media queries: rework-pure-grids.

We don't have a Grunt plugin to wrap this yet, but could look how we're using rework-pure-grids + Grunt to generate Pure's built-in grid units along with the config.

[ericf]

Right now, @tilomitra and I are dogfooding these new tools by converting Pure's website to use mobile-first styles. Since these tools are written in JavaScript, we're planning to use them to power a completely revamp the Grids page of the website with a fancy interactive web UI for customizing Grids for your app.

[doktorbro]

@ericf I’ll wait until the Grid page is ready.