aboutsummaryrefslogtreecommitdiff
path: root/less/responsive-utility-classes.less
diff options
context:
space:
mode:
Diffstat (limited to 'less/responsive-utility-classes.less')
-rw-r--r--less/responsive-utility-classes.less41
1 files changed, 41 insertions, 0 deletions
diff --git a/less/responsive-utility-classes.less b/less/responsive-utility-classes.less
new file mode 100644
index 000000000..78a06e8f9
--- /dev/null
+++ b/less/responsive-utility-classes.less
@@ -0,0 +1,41 @@
+// RESPONSIVE CLASSES
+// ------------------
+
+// Hide from screenreaders and browsers
+// Credit: HTML5 Boilerplate
+.hidden {
+ display: none;
+ visibility: hidden;
+}
+
+// Visibility utilities
+
+// For desktops
+.visible-phone { display: none; }
+.visible-tablet { display: none; }
+.visible-desktop { display: block; }
+.hidden-phone { display: block; }
+.hidden-tablet { display: block; }
+.hidden-desktop { display: none; }
+
+// Phones only
+@media (max-width: 767px) {
+ // Show
+ .visible-phone { display: block; }
+ // Hide
+ .hidden-phone { display: none; }
+ // Hide everything else
+ .hidden-desktop { display: block; }
+ .visible-desktop { display: none; }
+}
+
+// Tablets & small desktops only
+@media (min-width: 768px) and (max-width: 979px) {
+ // Show
+ .visible-tablet { display: block; }
+ // Hide
+ .hidden-tablet { display: none; }
+ // Hide everything else
+ .hidden-desktop { display: block; }
+ .visible-desktop { display: none; }
+}