Skip to content
This repository has been archived by the owner on Sep 10, 2019. It is now read-only.

grid-orient uses vertical/horizontal alignment parameters not true/false #212

Merged
merged 4 commits into from
Dec 11, 2014
+8 −8
Merged

grid-orient uses vertical/horizontal alignment parameters not true/false #212

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
46fd2fb
grid-orient uses vertical/horizontal alignment parameters not true/false
gabysbrain Dec 5, 2014
e933568
need sass if statement
gabysbrain Dec 5, 2014
3349617
grid-block and grid-frame should use $direction like grid-orient
gabysbrain Dec 11, 2014
d125a96
use $orientation for the orientation parameter name to be consistent …
gabysbrain Dec 11, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 8 additions & 8 deletions scss/components/_grid.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,12 +49,12 @@ $block-grid-max-size: 6;

@group grid

@param {string} $direction - Direction of the grid, either horizontal or vertical.
@param {string} $orientation - Direction of the grid, either horizontal or vertical.

@output A flex-flow property to match the direction given.
*/
@mixin grid-orient($direction: horizontal) {
@if ($direction == vertical) {
@mixin grid-orient($orientation: horizontal) {
@if ($orientation == vertical) {
flex-flow: column nowrap;
align-items: stretch;
}
Expand Down Expand Up @@ -210,14 +210,14 @@ $block-grid-max-size: 6;
/*
Frames are containers that stretch to the full dimmensions of the browser window.
*/
@mixin grid-frame($size: expand, $vertical: false, $wrap: false, $align: left, $order: 0) {
@mixin grid-frame($size: expand, $orientation: horizontal, $wrap: false, $align: left, $order: 0) {
display: flex;
height: 100vh;
position: relative;
overflow: hidden;

@include grid-size($size);
@include grid-orient($vertical);
@include grid-orient($orientation);
@include grid-wrap($wrap);
@include grid-align($align);
@include grid-order($order);
Expand All @@ -226,14 +226,14 @@ $block-grid-max-size: 6;
/*
Groups are collections of content items. They're the "rows" of Foundation for Apps.
*/
@mixin grid-block($size: expand, $vertical: false, $wrap: false, $align: left, $order: 0) {
@include grid-frame($size, $vertical, $wrap, $align, $order);
@mixin grid-block($size: expand, $orientation: horizontal, $wrap: false, $align: left, $order: 0) {
@include grid-frame($size, $orientation, $wrap, $align, $order);

// Reset the height used by frames
height: auto;

// Blocks will scroll by default if their content overflows
@if ($vertical) {
@if ($orientation == vertical) {
overflow-x: auto;
}
@else {
Expand Down