Last active
December 1, 2017 19:22
-
-
Save jcardoz/a1f2fe3dc975934fad5c12c5e16eca2a to your computer and use it in GitHub Desktop.
configuration for bootstrap 4 grid system - addition of another breakpoint
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| $grid-columns: 12; | |
| $grid-gutter-width: 30px; | |
| $grid-breakpoints: ( | |
| // This is added so bootstrap doesnt throw a warning on compilation | |
| xs: 0, | |
| // Extra small screen / phone | |
| sm: 320px, | |
| // Small screen / phone | |
| md: 480px, | |
| // Medium screen / tablet | |
| lg: 768px, | |
| // Large screen / desktop | |
| xl: 1024px, | |
| // Extra large screen / wide desktop | |
| xxl: 1280px | |
| ); | |
| $container-max-widths: ( | |
| sm: 300px, // 10px spacing on each side | |
| md: 420px, // 20px spacing on each side | |
| lg: 728px, // 40px spacing on each side | |
| xl: 944px, // 40px spacing on each side | |
| xxl: 1200px // 40px spacing on each side | |
| ); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
configuration for bootstrap 4 grid system - addition of another breakpoint (XXL)