feat: add support for current breakpoint to `xy-cell-offset()` and `xy-grid-layout()`

Add support for contextual breakpoint set by the `breakpoint()` mixin to the `xy-cell-offset()` mixin, and add documentation abou existing support to the `xy-grid-layout()` mixin.

diff --git a/scss/xy-grid/_layout.scss b/scss/xy-grid/_layout.scss
index 4c37f517209d53b6a9831bcda7fe4cad6d2848e6..f8c91f6972f88b46210761a6ee19ee0f05c3397d 100644 (file)
--- a/scss/xy-grid/_layout.scss
+++ b/scss/xy-grid/_layout.scss
@@ -14,7 +14,7 @@
 /// @param {Number|Map} $gutters [$grid-margin-gutters] - Map or single value for gutters.
 /// @param {Keyword} $gutter-type [margin] - Type of gutter to output. Accepts `margin`, `padding` or `none`.
 /// @param {List} $gutter-position [null] - The position to apply gutters to. Accepts `top`, `bottom`, `left`, `right` in any combination. By default `right left` for horizontal cells and `top bottom` for vertical cells.
-/// @param {String} $breakpoint [null] - The breakpoint to use for the cell generation.
+/// @param {String} $breakpoint [null] - The breakpoint to use for the cell generation. If using with the `breakpoint()` mixin this will be set automatically unless manually entered.
 /// @param {Boolean} $vertical [false] - Set to true to output vertical (height) styles rather than widths.
 /// @param {List} $output [(base size gutters)] - Cell parts to output. You will need to generate others parts of the cell seperately, it may not work correctly otherwise.
 @mixin xy-grid-layout(

diff --git a/scss/xy-grid/_position.scss b/scss/xy-grid/_position.scss
index 2f930f22b65eafde4d1dd59e8ac6e37e4c72f757..137326735cd2c0b1a274245a78ced4ece92c5bd8 100644 (file)
--- a/scss/xy-grid/_position.scss
+++ b/scss/xy-grid/_position.scss
@@ -11,16 +11,17 @@
 /// @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|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] - Single value, breakpoint name, or list of breakpoint names to use for `$gutters` (see `-zf-breakpoint-value()`). 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,
  $gutters: $grid-margin-gutters,
  $gutter-type: margin,
- $breakpoint: $-zf-zero-breakpoint,
+ $breakpoint: null,
  $vertical: false
 ) {
   $direction: if($vertical, 'top', $global-left);
+  $breakpoint: -zf-current-breakpoint($breakpoint, $default: $-zf-zero-breakpoint);
 
   @include -zf-breakpoint-value($breakpoint, $gutters) {
     $gutter: rem-calc($-zf-bp-value) / 2;