From 44ed351664638a481ec98ba087736eef2c052a4a Mon Sep 17 00:00:00 2001 From: PhilippeVay Date: Fri, 24 Jan 2014 23:58:06 +0100 Subject: [PATCH 1/5] Adding width class .wauto --- less/_01-base.less | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/less/_01-base.less b/less/_01-base.less index 44d4c9d..9da380d 100644 --- a/less/_01-base.less +++ b/less/_01-base.less @@ -323,7 +323,7 @@ img.left, img.right { /* .. use only when needed */ /* ----------------------------- */ -/* blocks widths (percentage and pixels) */ +/* blocks widths (percentage, pixels and auto) */ .w10 { width: 10%; } .w20 { width: 20%; } .w25 { width: 25%; } @@ -354,6 +354,7 @@ img.left, img.right { .w1140p { width: 1140px; } .mw1140p { max-width: 1140px; } +.wauto { width: auto; } /* ----------------------------- */ /* == spacing helpers */ @@ -436,7 +437,7 @@ source https://github.com/stubbornella/oocss/blob/master/core/spacing/space.css .em(@h6-size); } -/* haslayout for IE6/IE7 */ +/* hasLayout for IE6/IE7 */ .ie67 .clearfix, .ie67 .line, .ie67 .mod, From 549e41855a367e30cd6b8abcb932454d105d1f48 Mon Sep 17 00:00:00 2001 From: PhilippeVay Date: Fri, 24 Jan 2014 23:59:21 +0100 Subject: [PATCH 2/5] Removing keyword and prefix tablet: should always be small --- less/_06-rwd.less | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/less/_06-rwd.less b/less/_06-rwd.less index 804c4f2..ccb8abb 100644 --- a/less/_06-rwd.less +++ b/less/_06-rwd.less @@ -18,7 +18,6 @@ /* layouts for large (l) screens */ .large-hidden, - .tablet-hidden { display: none !important; } .large-visible { display: block !important; } .large-no-float {float: none; } .large-inbl { @@ -58,7 +57,7 @@ @media (max-width: @smallscreen) { - /* quick tablet reset */ + /* quick reset in small resolution and less */ .w600p, .w700p, .w800p, @@ -70,8 +69,7 @@ } /* layouts for medium (m) screens */ - .small-hidden, - .tablet-hidden { display: none !important; } + .small-hidden { display: none !important; } .small-visible { display: block !important; } .small-no-float {float: none; } .small-inbl { From 37150f2ec028a73592ca7fda4b62cc960a5d003a Mon Sep 17 00:00:00 2001 From: PhilippeVay Date: Sat, 25 Jan 2014 10:07:27 +0100 Subject: [PATCH 3/5] Removing keyword and prefix phone: should always be tiny. Replacing in a comment in MQ about small medium/m by small/s --- less/_06-rwd.less | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/less/_06-rwd.less b/less/_06-rwd.less index ccb8abb..36f9717 100644 --- a/less/_06-rwd.less +++ b/less/_06-rwd.less @@ -68,7 +68,7 @@ float: none; } - /* layouts for medium (m) screens */ + /* layouts for small (s) screens */ .small-hidden { display: none !important; } .small-visible { display: block !important; } .small-no-float {float: none; } @@ -142,8 +142,7 @@ } /* layouts for tiny (t) screens */ - .tiny-hidden, - .phone-hidden { display: none !important; } + .tiny-hidden { display: none !important; } .tiny-visible { display: block !important; } .tiny-no-float {float: none;} .tiny-inbl { From f93f2af058366b8d89668cf474909a9e5a69f5e0 Mon Sep 17 00:00:00 2001 From: PhilippeVay Date: Sat, 25 Jan 2014 10:15:51 +0100 Subject: [PATCH 4/5] Flexbox: add link to tutorial and removes whitespace before colon --- less/_07-flexbox.less | 35 ++++++++++++++++++----------------- 1 file changed, 18 insertions(+), 17 deletions(-) diff --git a/less/_07-flexbox.less b/less/_07-flexbox.less index 80f65f5..e577f03 100644 --- a/less/_07-flexbox.less +++ b/less/_07-flexbox.less @@ -1,11 +1,12 @@ -/* flexbox layout */ +/* flexbox layout + Tutorial: http://knacss.com/demos/tutoriel.html#flex */ .flex { - display : -webkit-box; - display : -moz-box; + display: -webkit-box; + display: -moz-box; display: -ms-flexbox; - display : -webkit-flex; - display : flex; + display: -webkit-flex; + display: flex; } .flex-h { -webkit-box-orient: horizontal; @@ -31,24 +32,24 @@ .flex-start { -webkit-box-ordinal-group: -1; -moz-box-ordinal-group: 0; - -ms-flex-order : -1; - -webkit-order : -1; - -moz-order : -1; - order : -1; + -ms-flex-order: -1; + -webkit-order: -1; + -moz-order: -1; + order: -1; } .flex-mid { -webkit-box-ordinal-group: 1; -moz-box-ordinal-group: 1; - -ms-flex-order : 1; - -webkit-order : 1; - -moz-order : 1; - order : 1; + -ms-flex-order: 1; + -webkit-order: 1; + -moz-order: 1; + order: 1; } .flex-end { -webkit-box-ordinal-group: 42; -moz-box-ordinal-group: 42; - -ms-flex-order : 42; - -webkit-order : 42; - -moz-order : 42; - order : 42; + -ms-flex-order: 42; + -webkit-order: 42; + -moz-order: 42; + order: 42; } \ No newline at end of file From dd84c139a6a94eb36f9a1e22cc4d35675776b26d Mon Sep 17 00:00:00 2001 From: PhilippeVay Date: Sat, 25 Jan 2014 10:43:12 +0100 Subject: [PATCH 5/5] RWD: adding .tiny-wauto (.small-wauto already exists) --- less/_06-rwd.less | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/less/_06-rwd.less b/less/_06-rwd.less index 36f9717..44c2c52 100644 --- a/less/_06-rwd.less +++ b/less/_06-rwd.less @@ -132,7 +132,8 @@ } .w300p, .w400p, - .w500p { + .w500p, + .tiny-wauto { width: auto; float: none; }