Index: scss/_grid.scss |
=================================================================== |
--- a/scss/_grid.scss |
+++ b/scss/_grid.scss |
@@ -15,16 +15,20 @@ |
* You should have received a copy of the GNU General Public License |
* along with website-defaults. If not, see <http://www.gnu.org/licenses/>. |
*/ |
/******************************************************************************* |
* Grid component |
******************************************************************************/ |
+$half-breakpoint: $tablet-breakpoint !default; |
+$third-breakpoint: $desktop-breakpoint !default; |
+$fourth-breakpoint: $desktop-breakpoint !default; |
+ |
/** |
* - .row contains one or more .column(s) |
* - .row clears .column(s) |
* - .row negates the left & right padding of it's left-most & right-most |
* .column(s) while preserving consistent padding between .column(s) |
*/ |
.row |
{ |
@@ -62,41 +66,40 @@ |
} |
.reverse .column, |
[dir="rtl"] .column |
{ |
float: right; |
} |
-@media(min-width: $tablet-breakpoint) |
+@media(min-width: $half-breakpoint) |
{ |
+ .one-half, |
.one-fourth |
{ |
width: 50%; |
} |
} |
-@media(min-width: $desktop-breakpoint) |
+@media(min-width: $third-breakpoint) |
{ |
- .one-half |
- { |
- width: 50%; |
- } |
- |
.one-third |
{ |
width: 33.333333%; |
} |
.two-thirds |
{ |
width: 66.666667%; |
} |
+} |
+@media(min-width: $fourth-breakpoint) |
+{ |
.one-fourth |
{ |
width: 25%; |
} |
.three-fourths |
{ |
width: 75%; |