feat: add xxl breakpoint

Author: mrholek

js/src/sidebar.js

@@ -36,7 +36,8 @@ const Default = {
     sm: 'c-sidebar-sm-show',
     md: 'c-sidebar-md-show',
     lg: 'c-sidebar-lg-show',
-    xl: 'c-sidebar-xl-show'
+    xl: 'c-sidebar-xl-show',
+    xxl: 'c-sidebar-xxl-show'
   },
   dropdownAccordion: true
 }

scss/variables/_grid.scss

@@ -6,11 +6,12 @@
 // adapting to different screen sizes, for use in media queries.
 
 $grid-breakpoints: (
-  xs:  0,
-  sm:  576px,
-  md:  768px,
-  lg:  992px,
-  xl:  1200px
+  xs: 0,
+  sm: 576px,
+  md: 768px,
+  lg: 992px,
+  xl: 1200px,
+  xxl: 1400px
 ) !default;
 
 @include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
@@ -22,10 +23,11 @@ $grid-breakpoints: (
 // Define the maximum width of `.container` for different screen sizes.
 
 $container-max-widths: (
-  sm:  540px,
-  md:  720px,
-  lg:  960px,
-  xl:  1140px
+  sm: 540px,
+  md: 720px,
+  lg: 960px,
+  xl: 1140px,
+  xxl: 1320px
 ) !default;
 
 @include _assert-ascending($container-max-widths, "$container-max-widths");