_grid-framework.scss 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. // Framework grid generation
  2. //
  3. // Used only by Bootstrap to generate the correct number of grid classes given
  4. // any value of `$grid-columns`.
  5. @mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) {
  6. $breakpoint-counter: 0;
  7. @each $breakpoint in map-keys($breakpoints) {
  8. $breakpoint-counter: ($breakpoint-counter + 1);
  9. @include media-breakpoint-up($breakpoint, $breakpoints) {
  10. @if $enable-flex {
  11. .col-#{$breakpoint} {
  12. position: relative;
  13. flex-basis: 0;
  14. flex-grow: 1;
  15. max-width: 100%;
  16. min-height: 1px;
  17. padding-right: calc($grid-gutter-width / 2);
  18. padding-left: calc($grid-gutter-width / 2);
  19. }
  20. }
  21. @for $i from 1 through $columns {
  22. .col-#{$breakpoint}-#{$i} {
  23. @include make-col($i, $columns);
  24. }
  25. }
  26. @each $modifier in (pull, push) {
  27. @for $i from 0 through $columns {
  28. .#{$modifier}-#{$breakpoint}-#{$i} {
  29. @include make-col-modifier($modifier, $i, $columns);
  30. }
  31. }
  32. }
  33. // `$columns - 1` because offsetting by the width of an entire row isn't possible
  34. @for $i from 0 through ($columns - 1) {
  35. @if $breakpoint-counter != 1 or $i != 0 {
  36. // Avoid emitting useless .col-xs-offset-0
  37. .offset-#{$breakpoint}-#{$i} {
  38. @include make-col-modifier(offset, $i, $columns);
  39. }
  40. }
  41. }
  42. }
  43. }
  44. }