public/assets/bootstrap-rtl-3-3-4/less/mixins/grid-rtl.less

   1 // RTL Grid system
   2 //
   3 // Generate semantic rtl grid columns with these mixins.
   4
   5 // Generate the extra small columns
   6 .make-xs-column(@columns; @gutter: @grid-gutter-width) {
   7   float: right;
   8 }
   9 .make-xs-column-offset(@columns) {
  10   margin-right: percentage((@columns / @grid-columns));
  11   margin-left: 0;
  12 }
  13 .make-xs-column-push(@columns) {
  14   right: percentage((@columns / @grid-columns));
  15   left: auto;
  16 }
  17 .make-xs-column-pull(@columns) {
  18   left: percentage((@columns / @grid-columns));
  19   right: auto;
  20 }
  21
  22 // Generate the small columns
  23 .make-sm-column(@columns; @gutter: @grid-gutter-width) {
  24
  25   @media (min-width: @screen-sm-min) {
  26     float: right;
  27   }
  28 }
  29 .make-sm-column-offset(@columns) {
  30   @media (min-width: @screen-sm-min) {
  31     margin-right: percentage((@columns / @grid-columns));
  32     margin-left: 0;
  33   }
  34 }
  35 .make-sm-column-push(@columns) {
  36   @media (min-width: @screen-sm-min) {
  37     right: percentage((@columns / @grid-columns));
  38     left: auto;
  39   }
  40 }
  41 .make-sm-column-pull(@columns) {
  42   @media (min-width: @screen-sm-min) {
  43     left: percentage((@columns / @grid-columns));
  44     right: auto;
  45   }
  46 }
  47
  48 // Generate the medium columns
  49 .make-md-column(@columns; @gutter: @grid-gutter-width) {
  50
  51   @media (min-width: @screen-md-min) {
  52     float: right;
  53   }
  54 }
  55 .make-md-column-offset(@columns) {
  56   @media (min-width: @screen-md-min) {
  57     margin-right: percentage((@columns / @grid-columns));
  58     margin-left: 0;
  59   }
  60 }
  61 .make-md-column-push(@columns) {
  62   @media (min-width: @screen-md-min) {
  63     right: percentage((@columns / @grid-columns));
  64     left: auto;
  65   }
  66 }
  67 .make-md-column-pull(@columns) {
  68   @media (min-width: @screen-md-min) {
  69     left: percentage((@columns / @grid-columns));
  70     right: auto;
  71   }
  72 }
  73
  74 // Generate the large columns
  75 .make-lg-column(@columns; @gutter: @grid-gutter-width) {
  76
  77   @media (min-width: @screen-lg-min) {
  78     float: right;
  79   }
  80 }
  81 .make-lg-column-offset(@columns) {
  82   @media (min-width: @screen-lg-min) {
  83     margin-right: percentage((@columns / @grid-columns));
  84     margin-left: 0;
  85   }
  86 }
  87 .make-lg-column-push(@columns) {
  88   @media (min-width: @screen-lg-min) {
  89     right: percentage((@columns / @grid-columns));
  90     left: auto;
  91   }
  92 }
  93 .make-lg-column-pull(@columns) {
  94   @media (min-width: @screen-lg-min) {
  95     left: percentage((@columns / @grid-columns));
  96     right: auto;
  97   }
  98 }