diff --git a/Gruntfile.js b/Gruntfile.js
index b9bbb5f..3ad3951 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -203,7 +203,9 @@ module.exports = function (grunt) {
md: 'screen and (min-width: 48em)', // 768px
lg: 'screen and (min-width: 64em)', // 1024px
xl: 'screen and (min-width: 80em)', // 1280px
- xxl: 'screen and (min-width: 120em)' // 1920px
+ xxl: 'screen and (min-width: 120em)', // 1920px
+ xxxl: 'screen and (min-width: 160em)', // 2560px
+ x4k: 'screen and (min-width: 240em)' // 3840px
}
}
}
diff --git a/site/src/pages/grids/index.js b/site/src/pages/grids/index.js
index 002a4f0..1466aa3 100644
--- a/site/src/pages/grids/index.js
+++ b/site/src/pages/grids/index.js
@@ -567,6 +567,19 @@ function Grids() {
≥ 1920px |
.pure-u-xxl-* |
+
+ xxxl |
+ @media screen and (min-width: 160em) |
+ ≥ 2560px |
+ .pure-u-xxxl-* |
+
+
+ x4k |
+ @media screen and (min-width: 240em) |
+ ≥ 3840px |
+ .pure-u-x4k-* |
+
+
diff --git a/site/src/pages/start/index.js b/site/src/pages/start/index.js
index 1312fd7..7aabeed 100644
--- a/site/src/pages/start/index.js
+++ b/site/src/pages/start/index.js
@@ -154,6 +154,18 @@ function Start() {
≥ 1920px |
.pure-u-xxl-* |
+
+ xxxl |
+ @media screen and (min-width: 160em) |
+ ≥ 2560px |
+ .pure-u-xxxl-* |
+
+
+ x4k |
+ @media screen and (min-width: 240em) |
+ ≥ 3840px |
+ .pure-u-x4k-* |
+
diff --git a/site/src/pages/tools/index.js b/site/src/pages/tools/index.js
index 5dd2da4..bc2a972 100644
--- a/site/src/pages/tools/index.js
+++ b/site/src/pages/tools/index.js
@@ -95,7 +95,9 @@ function Tools() {
md: 'screen and (min-width: 48em)', // 768px
lg: 'screen and (min-width: 64em)', // 1024px
xl: 'screen and (min-width: 80em)', // 1280px
- xxl: 'screen and (min-width: 120em)' // 1920px
+ xxl: 'screen and (min-width: 120em)', // 1920px
+ xxxl: 'screen and (min-width: 160em)', // 2560px
+ x4k: 'screen and (min-width: 240em)' // 3840px
}
}
}
@@ -130,7 +132,9 @@ function Tools() {
md: 'screen and (min-width: 48em)', // 768px
lg: 'screen and (min-width: 64em)', // 1024px
xl: 'screen and (min-width: 80em)', // 1280px
- xxl: 'screen and (min-width: 120em)' // 1920px
+ xxl: 'screen and (min-width: 120em)', // 1920px
+ xxxl: 'screen and (min-width: 160em)' // 2560px
+ x4k: 'screen and (min-width: 240em)' // 3840px
}
})).toString();