s push pull grids on tablet

by ian_smithz

HTML

<link rel="stylesheet" href="https://www.screwfix.com/assets/css/sfx.min.css">
<div class="row">
    <div class="sm-24 md-12 lg-8 cols blue-bg">blue 1</div>
    <div class="sm-24 md-12 lg-8 cols white-bg">white 1</div>
    <div class="sm-24 md-12 md-push-12 lg-8 lg-push-0 cols blue-bg">blue 2</div>
    <div class="sm-24 md-12 md-pull-12 lg-8 lg-pull-0 cols white-bg">white 2</div>
    <div class="sm-24 md-12 lg-8 cols blue-bg">blue 3</div>
    <div class="sm-24 md-12 lg-8 cols white-bg">white 3</div>
</div>

<br><br>

<div class="row">
    <div class="sm-24 md-12 lg-8 cols blue-bg">blue 1</div>
    <div class="sm-24 md-12 lg-8 cols white-bg">white 1</div>
    <div class="sm-24 md-12 md-push-12 lg-8 lg-push-0 cols blue-bg">blue 2</div>
    <div class="sm-24 md-12 md-pull-12 lg-8 lg-pull-0 cols white-bg">white 2</div>
    <div class="sm-24 md-12 lg-8 cols blue-bg">blue 3</div>
    <div class="sm-24 md-12 lg-8 cols white-bg">white 3</div>
</div>

CSS

/* just demo css */

 .white-bg {background: white}
 
 .blue-bg {background: blue; color: #fff}

JavaScript

// need to grab the bootstrap push pull classes and put them in our dirty grids

//just looked at grids sass file and the currewnt pushh pull classes are like this: 
// .md-pull-6 amd md-push-6