bootstrap-grid.scss 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. // Bootstrap Grid only
  2. //
  3. // Includes relevant variables and mixins for the regular (non-flexbox) grid
  4. // system, as well as the generated predefined classes (e.g., `.col-4-sm`).
  5. //
  6. // Variables
  7. //
  8. // Grid breakpoints
  9. //
  10. // Define the minimum and maximum dimensions at which your layout will change,
  11. // adapting to different screen sizes, for use in media queries.
  12. $grid-breakpoints: (
  13. // Extra small screen / phone
  14. xs: 0,
  15. // Small screen / phone
  16. sm: 544px,
  17. // Medium screen / tablet
  18. md: 768px,
  19. // Large screen / desktop
  20. lg: 992px,
  21. // Extra large screen / wide desktop
  22. xl: 1200px
  23. ) !default;
  24. // Grid containers
  25. //
  26. // Define the maximum width of `.container` for different screen sizes.
  27. $container-max-widths: (
  28. sm: 576px,
  29. md: 720px,
  30. lg: 940px,
  31. xl: 1140px
  32. ) !default;
  33. // Grid columns
  34. //
  35. // Set the number of columns and specify the width of the gutters.
  36. $grid-columns: 12 !default;
  37. $grid-gutter-width: 1.875rem !default; // 30px
  38. //
  39. // Grid mixins
  40. //
  41. @import "variables";
  42. @import "mixins/clearfix";
  43. @import "mixins/breakpoints";
  44. @import "mixins/grid-framework";
  45. @import "mixins/grid";
  46. @import "grid";