Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Unified Diff: scss/_grid.scss

Issue 29539827: Noissue - Added configurable breakpoints and phablet widths to grid (Closed) Base URL: https://hg.adblockplus.org/website-defaults
Patch Set: Renamed mobile to phone Created Sept. 11, 2017, 4:01 p.m.
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « no previous file | scss/_variables.scss » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
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%;
« no previous file with comments | « no previous file | scss/_variables.scss » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld