Add Column Shuffling

[CowDotDev]

Created a class structure allowing developers to shuffle around columns
in a grid allowing, for example, to put the column that would be on the
left by default, to the right and the column that would be on the the
right by default on the left. This adversely allows the column that is
now on the right, to collapse to the top above the column that is now on
the right.

This uses the same syntax as the grid system. The default shuffle (non
responsive) looks like left-1 or right-2 where right and left refer
to which side the column will shuffle from and the number represents how
many columns it will shuffle over.

<div class='pure-g'>
    <p class='pure-u-3-4 left-1'>right</p>
    <p class='pure-u-1-4 right-3'>left</p>
</div>

The responsive syntax for shuffling is also like the grid system, so left-sm-1 would apply when the
viewport is greater than 35.5em (default).

<div class='pure-g'>
    <p class='pure-u-3-4 pure-u-sm-2-5 pure-u-md-1-2 left-1 left-sm-3 left-md-1'>right</p>
    <p class='pure-u-1-4  pure-u-sm-3-5 pure-u-md-1-2 right-3 right-sm-2 right-md-1'>left</p>
</div>

[yahoocla]

Thank you for submitting this pull request, however I do not see a valid CLA on file for you. Before we can merge this request please visit https://yahoocla.herokuapp.com/ and agree to the terms. Thanks! 😄

[CowDotDev]

As far as I can tell, the only reason it failed the build test was because of "Adjoining Classes" which is only an IE6 issue... and do you really care about IE6 anymore? I kinda feel like adjoining classes are important to use here.

[yahoocla]

CLA is valid!

[jamesalley]

I'll be taking a closer look at this PR in the coming weeks. We hear you and appreciate the input. Also glad to see you got the CLA worked out. I agree, IE6 is not a concern for Pure, and therefore adjoining classes perhaps should be allowed.

[CowDotDev]

Thanks for the update James, really appreciate it! Let me know if there is anything I need to do.

[jamesalley]

Zach, there are a few things we need to work on with this PR-- and even then, I'm not promising I'll agree we should bundle it with Pure. (Perhaps it could be included as an optional file if folks want to create their own rollups.)

In any case, here are the problems we need to address now:

• There doesn't seem to be any content in your file (grids-column-shuffling.css)!
• Add a CSSLint rule to your file so that the adjoining classes rule is ignored.
• We might want to change this from left-right to start-end, so that the construct makes semantic sense in an RTL (right-to-left, e.g. Hebrew, Arabic) context. Otherwise, RTL users will have to wrap their heads around left being right and vice-versa.
• Also regarding RTL, we'll probably have to have an RTL variant of this file, or overrides for RTL context appended to this file.

[CowDotDev]

James,

I added all of the changes that you asked me to do, and they are in the most recent commit 7b55443 (Combine Media Offsets into One File). I have also included the .less files for both the RTL and LTR files in the directory /src/grids/less so that you can look how the LESS is set up, if you were at all curious.

[vikramrojo]

I just want throw some love out for the pure community, was just looking for this on a build & spent about 2mins looking before yay!

[vikramrojo]

I have a general git question, this issue along with mobile collapsible nav get merged into a project, where does one find that repo?

[CowDotDev]

@vikrambabu Glad I was able to help you out! The only issue with this right now is that it goes over IE's 4000 selector limit. I can easily fix this by removing some grid sizes, but I wasn't sure which to remove. (The 24 grid size is a selector hog.)

This issue and the mobile collapsible nav are two different repos. Mine for column shuffling can be found here: https://github.com/ZachCase/pure

The Mobile Collapsible Nav issues looks to have been fixed by the Pure dev team actually, and they stated that a new release with the fix is "imminent".

[jamesalley]

@vikrambabu As Zach says, the release of Pure 0.6.0 is imminent. As early as tomorrow I hope to have it out in Release Candidate form; you'll be able to easily play with it and see how you like it, and you'll be able to see the new examples on the staging server.

[vikramrojo]

Thanks @zachcase & @jamesalley, couldn't come at a better time as we're looking to launch sometime next week!

[redonkulus]

I do not believe this will be something we pull in by default in Pure. I think its best left in user land as it adds more weight and maintenance to the library.