From 2b088ef44e9476a6336487c65d42b74213cd2a19 Mon Sep 17 00:00:00 2001 From: Aristeides Stathopoulos Date: Mon, 27 May 2013 19:33:14 +0300 Subject: [PATCH 1/2] using screen-size variables for grids --- less/grid.less | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/less/grid.less b/less/grid.less index 82d2a355b8..1be9dfd183 100644 --- a/less/grid.less +++ b/less/grid.less @@ -39,21 +39,21 @@ // Responsive: Tablets and up @media screen and (min-width: @screen-tablet) { .container { - max-width: 728px; + max-width: (@screen-tablet - 40); } } // Responsive: Desktops and up @media screen and (min-width: @screen-desktop) { .container { - max-width: 940px; + max-width: (@screen-desktop - 52); } } // Responsive: Large desktops and up @media screen and (min-width: @screen-large-desktop) { .container { - max-width: 1170px; + max-width: (@screen-large-desktop - @grid-gutter-width); } } From 6fda25b4c16df2d34d298b373a64ef6f41da7a5a Mon Sep 17 00:00:00 2001 From: Aristeides Stathopoulos Date: Mon, 27 May 2013 23:00:39 +0300 Subject: [PATCH 2/2] Adding variables for container sizes --- less/grid.less | 6 +++--- less/variables.less | 13 +++++++++++++ 2 files changed, 16 insertions(+), 3 deletions(-) diff --git a/less/grid.less b/less/grid.less index 1be9dfd183..6d5a8e345e 100644 --- a/less/grid.less +++ b/less/grid.less @@ -39,21 +39,21 @@ // Responsive: Tablets and up @media screen and (min-width: @screen-tablet) { .container { - max-width: (@screen-tablet - 40); + max-width: @container-tablet; } } // Responsive: Desktops and up @media screen and (min-width: @screen-desktop) { .container { - max-width: (@screen-desktop - 52); + max-width: @container-desktop; } } // Responsive: Large desktops and up @media screen and (min-width: @screen-large-desktop) { .container { - max-width: (@screen-large-desktop - @grid-gutter-width); + max-width: @container-large-desktop; } } diff --git a/less/variables.less b/less/variables.less index 9cd8f830b3..97aac8395f 100644 --- a/less/variables.less +++ b/less/variables.less @@ -405,6 +405,19 @@ @screen-large-desktop: @screen-large; +// Container sizes +// -------------------------------------------------- + +// Small screen / tablet +@container-tablet: 728px; + +// Medium screen / desktop +@container-desktop: 940px; + +// Large screen / wide desktop +@container-large-desktop: 1170px; + + // Grid system // --------------------------------------------------