summaryrefslogtreecommitdiffstats
path: root/css/bootstrap/responsive-utilities.less
diff options
context:
space:
mode:
authorArun Persaud <arun@nubati.net>2012-10-05 21:34:54 -0700
committerArun Persaud <arun@nubati.net>2012-10-05 21:38:18 -0700
commit494ee831e66d59afbf02d42ba59b7ba21f61c011 (patch)
tree6fd12684f7486c841ea0d246bafc6bdca6bc7afb /css/bootstrap/responsive-utilities.less
parent197cea7c7d2c60f7ca0e8c40b4413ae331cd432c (diff)
downloade-DoKo-494ee831e66d59afbf02d42ba59b7ba21f61c011.tar.gz
e-DoKo-494ee831e66d59afbf02d42ba59b7ba21f61c011.tar.bz2
e-DoKo-494ee831e66d59afbf02d42ba59b7ba21f61c011.zip
added less, moved bootstrap to less components
Diffstat (limited to 'css/bootstrap/responsive-utilities.less')
-rw-r--r--css/bootstrap/responsive-utilities.less43
1 files changed, 43 insertions, 0 deletions
diff --git a/css/bootstrap/responsive-utilities.less b/css/bootstrap/responsive-utilities.less
new file mode 100644
index 0000000..2c3f6c1
--- /dev/null
+++ b/css/bootstrap/responsive-utilities.less
@@ -0,0 +1,43 @@
+//
+// Responsive: Utility classes
+// --------------------------------------------------
+
+
+// Hide from screenreaders and browsers
+// Credit: HTML5 Boilerplate
+.hidden {
+ display: none;
+ visibility: hidden;
+}
+
+// Visibility utilities
+
+// For desktops
+.visible-phone { display: none !important; }
+.visible-tablet { display: none !important; }
+.hidden-phone { }
+.hidden-tablet { }
+.hidden-desktop { display: none !important; }
+.visible-desktop { display: inherit !important; }
+
+// Tablets & small desktops only
+@media (min-width: 768px) and (max-width: 979px) {
+ // Hide everything else
+ .hidden-desktop { display: inherit !important; }
+ .visible-desktop { display: none !important ; }
+ // Show
+ .visible-tablet { display: inherit !important; }
+ // Hide
+ .hidden-tablet { display: none !important; }
+}
+
+// Phones only
+@media (max-width: 767px) {
+ // Hide everything else
+ .hidden-desktop { display: inherit !important; }
+ .visible-desktop { display: none !important; }
+ // Show
+ .visible-phone { display: inherit !important; } // Use inherit to restore previous behavior
+ // Hide
+ .hidden-phone { display: none !important; }
+}