diff options
| author | Mark Otto <[email protected]> | 2012-02-21 08:24:18 -0800 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2012-02-21 08:24:18 -0800 |
| commit | f3ad4c7183251713eb021a400211cc9b07577080 (patch) | |
| tree | 29821f01779cd9a9c9f4069a83dcefad4bafb8f2 /less | |
| parent | 06d4756114f55406b99d20a83eec95039d9af4bd (diff) | |
| download | bootstrap-f3ad4c7183251713eb021a400211cc9b07577080.tar.xz bootstrap-f3ad4c7183251713eb021a400211cc9b07577080.zip | |
adding responsive utility classes and matching docs section with super neato table and test
Diffstat (limited to 'less')
| -rw-r--r-- | less/responsive.less | 31 | ||||
| -rw-r--r-- | less/scaffolding.less | 6 |
2 files changed, 34 insertions, 3 deletions
diff --git a/less/responsive.less b/less/responsive.less index 8c39f088e..9cfb59296 100644 --- a/less/responsive.less +++ b/less/responsive.less @@ -31,6 +31,37 @@ 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; } +} // UP TO LANDSCAPE PHONE diff --git a/less/scaffolding.less b/less/scaffolding.less index 47ce53818..c2e683ac6 100644 --- a/less/scaffolding.less +++ b/less/scaffolding.less @@ -3,8 +3,8 @@ // ------------------------------------------------------------------------------------------- -// STRUCTURAL LAYOUT -// ----------------- +// Body reset +// ---------- body { margin: 0; @@ -16,7 +16,7 @@ body { } -// LINKS +// Links // ----- a { |