From 83c4073ec76a4cc0d600b1c5fdb426d2adb69309 Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Tue, 25 Jun 2013 12:23:56 -0700 Subject: refactor responsive-utilities slightly --- less/responsive-utilities.less | 54 ++++++++++++------------------------------ 1 file changed, 15 insertions(+), 39 deletions(-) (limited to 'less/responsive-utilities.less') diff --git a/less/responsive-utilities.less b/less/responsive-utilities.less index 082109e5e..e6a8bf7e9 100644 --- a/less/responsive-utilities.less +++ b/less/responsive-utilities.less @@ -34,29 +34,26 @@ } // Visibility utilities - -// For Phones -.visible-sm { +.responsive-visibility() { display: block !important; tr& { display: table-row !important; } th&, td& { display: table-cell !important; } } + +// For Phones +.visible-sm { + .responsive-visibility; +} .visible-md { display: none !important; } .visible-lg { display: none !important; } .hidden-sm { display: none !important; } .hidden-md { - display: block !important; - tr& { display: table-row !important; } - th&, - td& { display: table-cell !important; } + .responsive-visibility; } .hidden-lg { - display: block !important; - tr& { display: table-row !important; } - th&, - td& { display: table-cell !important; } + .responsive-visibility; } @@ -64,25 +61,16 @@ @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { .visible-sm { display: none !important; } .visible-md { - display: block !important; - tr& { display: table-row !important; } - th&, - td& { display: table-cell !important; } + .responsive-visibility; } .visible-lg { display: none !important; } .hidden-sm { - display: block !important; - tr& { display: table-row !important; } - th&, - td& { display: table-cell !important; } + .responsive-visibility; } .hidden-md { display: none !important; } .hidden-lg { - display: block !important; - tr& { display: table-row !important; } - th&, - td& { display: table-cell !important; } + .responsive-visibility; } } @@ -91,23 +79,14 @@ .visible-sm { display: none !important; } .visible-md { display: none !important; } .visible-lg { - display: block !important; - tr& { display: table-row !important; } - th&, - td& { display: table-cell !important; } + .responsive-visibility; } .hidden-sm { - display: block !important; - tr& { display: table-row !important; } - th&, - td& { display: table-cell !important; } + .responsive-visibility; } .hidden-md { - display: block !important; - tr& { display: table-row !important; } - th&, - td& { display: table-cell !important; } + .responsive-visibility; } .hidden-lg { display: none !important; } } @@ -118,10 +97,7 @@ @media print { .visible-print { - display: block !important; - tr& { display: table-row !important; } - th&, - td& { display: table-cell !important; } + .responsive-visibility; } .hidden-print { display: none !important; } } -- cgit v1.2.3 From 327a951ca3754285432ae97b6c6be62dcd815905 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 25 Jun 2013 13:32:21 -0700 Subject: Move mixin to mixins.less --- less/responsive-utilities.less | 6 ------ 1 file changed, 6 deletions(-) (limited to 'less/responsive-utilities.less') diff --git a/less/responsive-utilities.less b/less/responsive-utilities.less index e6a8bf7e9..65fdc3d13 100644 --- a/less/responsive-utilities.less +++ b/less/responsive-utilities.less @@ -34,12 +34,6 @@ } // Visibility utilities -.responsive-visibility() { - display: block !important; - tr& { display: table-row !important; } - th&, - td& { display: table-cell !important; } -} // For Phones .visible-sm { -- cgit v1.2.3 From c9ccbd2cf0b5b37fe67e55a93223d4836f22da44 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 27 Jun 2013 18:43:29 -0700 Subject: Fixes #8329: add `!important` to `.hidden` --- less/responsive-utilities.less | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'less/responsive-utilities.less') diff --git a/less/responsive-utilities.less b/less/responsive-utilities.less index 65fdc3d13..ef80be7a9 100644 --- a/less/responsive-utilities.less +++ b/less/responsive-utilities.less @@ -29,8 +29,8 @@ // Hide from screenreaders and browsers // Credit: HTML5 Boilerplate .hidden { - display: none; - visibility: hidden; + display: none !important; + visibility: hidden !important; } // Visibility utilities -- cgit v1.2.3 From cb483b67589df7ac3ece33303b8ce944b3ac4b0e Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 27 Jun 2013 18:45:08 -0700 Subject: Add parens so sublime picks up on syntax highlighting --- less/responsive-utilities.less | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) (limited to 'less/responsive-utilities.less') diff --git a/less/responsive-utilities.less b/less/responsive-utilities.less index ef80be7a9..21e5d7556 100644 --- a/less/responsive-utilities.less +++ b/less/responsive-utilities.less @@ -37,17 +37,17 @@ // For Phones .visible-sm { - .responsive-visibility; + .responsive-visibility(); } .visible-md { display: none !important; } .visible-lg { display: none !important; } .hidden-sm { display: none !important; } .hidden-md { - .responsive-visibility; + .responsive-visibility(); } .hidden-lg { - .responsive-visibility; + .responsive-visibility(); } @@ -55,16 +55,16 @@ @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { .visible-sm { display: none !important; } .visible-md { - .responsive-visibility; + .responsive-visibility(); } .visible-lg { display: none !important; } .hidden-sm { - .responsive-visibility; + .responsive-visibility(); } .hidden-md { display: none !important; } .hidden-lg { - .responsive-visibility; + .responsive-visibility(); } } @@ -73,14 +73,14 @@ .visible-sm { display: none !important; } .visible-md { display: none !important; } .visible-lg { - .responsive-visibility; + .responsive-visibility(); } .hidden-sm { - .responsive-visibility; + .responsive-visibility(); } .hidden-md { - .responsive-visibility; + .responsive-visibility(); } .hidden-lg { display: none !important; } } @@ -91,7 +91,7 @@ @media print { .visible-print { - .responsive-visibility; + .responsive-visibility(); } .hidden-print { display: none !important; } } -- cgit v1.2.3 From fea69df80c3d304868d816a85a8b027b40a13f3d Mon Sep 17 00:00:00 2001 From: Julian Thilo Date: Mon, 1 Jul 2013 21:13:57 +0200 Subject: Fix responsive utilities for table elements This change prevents situations where specificity causes some rules to be overridden by the ones intended for mobile. * Added mixin `responsive-invisibility()` * Swapped out `display: none !important;` for new mixin --- less/responsive-utilities.less | 46 +++++++++++++++++++++++++++++++----------- 1 file changed, 34 insertions(+), 12 deletions(-) (limited to 'less/responsive-utilities.less') diff --git a/less/responsive-utilities.less b/less/responsive-utilities.less index 21e5d7556..38dd9639a 100644 --- a/less/responsive-utilities.less +++ b/less/responsive-utilities.less @@ -36,13 +36,19 @@ // Visibility utilities // For Phones -.visible-sm { +.visible-sm { .responsive-visibility(); } -.visible-md { display: none !important; } -.visible-lg { display: none !important; } +.visible-md { + .responsive-invisibility(); +} +.visible-lg { + .responsive-invisibility(); +} -.hidden-sm { display: none !important; } +.hidden-sm { + .responsive-invisibility(); +} .hidden-md { .responsive-visibility(); } @@ -53,16 +59,22 @@ // Tablets & small desktops only @media (min-width: @screen-tablet) and (max-width: @screen-tablet-max) { - .visible-sm { display: none !important; } + .visible-sm { + .responsive-invisibility(); + } .visible-md { .responsive-visibility(); } - .visible-lg { display: none !important; } + .visible-lg { + .responsive-invisibility(); + } .hidden-sm { .responsive-visibility(); } - .hidden-md { display: none !important; } + .hidden-md { + .responsive-invisibility(); + } .hidden-lg { .responsive-visibility(); } @@ -70,8 +82,12 @@ // For desktops @media (min-width: @screen-desktop) { - .visible-sm { display: none !important; } - .visible-md { display: none !important; } + .visible-sm { + .responsive-invisibility(); + } + .visible-md { + .responsive-invisibility(); + } .visible-lg { .responsive-visibility(); } @@ -82,16 +98,22 @@ .hidden-md { .responsive-visibility(); } - .hidden-lg { display: none !important; } + .hidden-lg { + .responsive-invisibility(); + } } // Print utilities -.visible-print { display: none !important; } +.visible-print { + .responsive-invisibility(); +} .hidden-print { } @media print { .visible-print { .responsive-visibility(); } - .hidden-print { display: none !important; } + .hidden-print { + .responsive-invisibility(); + } } -- cgit v1.2.3