From: Nicolas Coden Date: Tue, 4 Sep 2018 21:43:37 +0000 (+0200) Subject: Merge branch 'develop' into refactor/xy-cell X-Git-Tag: v6.6.0~3^2~68^2~4 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=fa616d39f043dea5299fbe847aa3103387b9251a;p=thirdparty%2Ffoundation%2Ffoundation-sites.git Merge branch 'develop' into refactor/xy-cell --- fa616d39f043dea5299fbe847aa3103387b9251a diff --cc scss/xy-grid/_position.scss index 8acd7918a,336275de5..f20a07c05 --- a/scss/xy-grid/_position.scss +++ b/scss/xy-grid/_position.scss @@@ -6,37 -6,12 +6,37 @@@ /// @group xy-grid //// +/// Returns the appropriate CSS value to offset a cell. +/// +/// @param {Number|List} $n - Size to offset by. You can pass in any value accepted by the `xy-cell()` mixin, such as `6`, `50%`, or `1 of 2`. +/// @param {Number|Map} $gutters [$grid-margin-gutters] Map of gutters or single value to use for responsive gutters. +/// @param {Keyword} $gutter-type [margin] The type of gutter to use. Can be `margin` or `padding` +/// @param {String} $breakpoint [null] - The name of the breakpoint size in your gutters map to get the size from. If using with the `breakpoint()` mixin this will be set automatically unless manually entered. +/// +/// @returns {Number|String} The cell offset property value. +@function xy-cell-offset( + $n, + $gutters: $grid-margin-gutters, + $gutter-type: margin, + $breakpoint: null +) { + $breakpoint: -zf-current-breakpoint($breakpoint, $default: $-zf-zero-breakpoint); + $size: xy-cell-size($n); + + $offset: $size; + @if ($gutter-type == 'margin') { + $gutter: rem-calc(xy-cell-gutters($gutters, $breakpoint) / 2); - $offset: calc(#{$size} + #{$gutter}); ++ $offset: if($gutter == 0, $size, calc(#{$size} + #{$gutter})); + } + @return $offset; +} + /// Offsets a column to the right/bottom by `$n` columns. /// -/// @param {Number|List} $n - Size to offset by. You can pass in any value accepted by the `zf-cell()` mixin, such as `6`, `50%`, or `1 of 2`. +/// @param {Number|List} $n - Size to offset by. You can pass in any value accepted by the `xy-cell()` mixin, such as `6`, `50%`, or `1 of 2`. /// @param {Number|Map} $gutters [$grid-margin-gutters] Map of gutters or single value to use for responsive gutters. /// @param {Keyword} $gutter-type [margin] The type of gutter to use. Can be `margin` or `padding` -/// @param {Number|Array|Keyword} $breakpoint [$-zf-zero-breakpoint] - Single value, breakpoint name, or list of breakpoint names to use for `$gutters`. See `-zf-breakpoint-value()`. +/// @param {Number|Array|Keyword} $breakpoint [null] - Breakpoint to use for `$gutters`. It can be a breakpoint name, list of breakpoints or `auto` for all breakpoints. If a list is given, media-queries will be generated. If using with the `breakpoint()` mixin this will be set automatically unless manually entered. /// @param {Boolean} $vertical [false] Sets the direction of the offset. If set to true will apply margin-top instead. @mixin xy-cell-offset( $n,