From 7a87e0e7520337f622da066c32b2c095e1af7a7b Mon Sep 17 00:00:00 2001 From: Will H McMahan Date: Fri, 8 Jul 2016 10:34:52 -0400 Subject: [PATCH] Add retrieve-neat-setting function `retrieve-neat-setting` takes the default map `$_neat-grid-default` and merges it with the map passed in to it (typically `$neat-grid`) and then retrieves the value for the key passed into it. --- core/_neat.scss | 2 ++ .../functions/_retrieve-neat-settings.scss | 18 ++++++++++++++++++ core/neat/mixins/_grid-column.scss | 8 ++++---- core/neat/mixins/_grid-container.scss | 4 ++-- core/neat/mixins/_grid-push.scss | 18 +++++++++--------- core/neat/settings/_settings.scss | 14 +++++++++++++- 6 files changed, 48 insertions(+), 16 deletions(-) create mode 100644 core/neat/functions/_retrieve-neat-settings.scss diff --git a/core/_neat.scss b/core/_neat.scss index eef4abc6..69f3fdad 100644 --- a/core/_neat.scss +++ b/core/_neat.scss @@ -6,6 +6,8 @@ @import "neat/settings/settings"; +@import "neat/functions/retrieve-neat-settings"; + @import "neat/mixins/grid-column"; @import "neat/mixins/grid-container"; @import "neat/mixins/grid-push"; diff --git a/core/neat/functions/_retrieve-neat-settings.scss b/core/neat/functions/_retrieve-neat-settings.scss new file mode 100644 index 00000000..fc196c85 --- /dev/null +++ b/core/neat/functions/_retrieve-neat-settings.scss @@ -0,0 +1,18 @@ +@charset "UTF-8"; +/// Return a Neat setting. +/// +/// @argument {map} $grid +/// +/// @argument {string} $setting +/// +/// @return {boolean | color | list | number | string} +/// +/// @example scss +/// _retrieve-neat-setting($neat-grid, columns) +/// +/// @access private + +@function _retrieve-neat-setting($grid, $setting) { + $_grid-settings: map-merge($_neat-grid-defaults, $grid); + @return map-get($_grid-settings, $setting); +} diff --git a/core/neat/mixins/_grid-column.scss b/core/neat/mixins/_grid-column.scss index 00486e8d..1c4b1dad 100644 --- a/core/neat/mixins/_grid-column.scss +++ b/core/neat/mixins/_grid-column.scss @@ -3,7 +3,7 @@ /// /// @argument {number (unitless)} $columns [1] /// -/// @argument {map} $grid [$neat-default-grid] +/// @argument {map} $grid [$neat-grid] /// The grid used to generate the column. /// /// @example scss @@ -18,9 +18,9 @@ /// margin-left: 20px; /// } -@mixin grid-column($columns: 1, $grid: $neat-default-grid) { - $_grid-columns: map-get($grid, columns); - $_grid-gutter: map-get($grid, gutter); +@mixin grid-column($columns: 1, $grid: $neat-grid) { + $_grid-columns: _retrieve-neat-setting($grid, columns); + $_grid-gutter: _retrieve-neat-setting($grid, gutter); $_column-ratio: $columns / $_grid-columns; diff --git a/core/neat/mixins/_grid-container.scss b/core/neat/mixins/_grid-container.scss index 46a1fac1..ee1c18b6 100644 --- a/core/neat/mixins/_grid-container.scss +++ b/core/neat/mixins/_grid-container.scss @@ -1,7 +1,7 @@ @charset "UTF-8"; /// Creates a Neat grid container with clearfix. /// -/// @argument {map} $grid [$neat-default-grid] +/// @argument {map} $grid [$neat-grid] /// The type of grid for this column. /// /// @example scss @@ -16,7 +16,7 @@ /// display: block; /// } -@mixin grid-container($grid: $neat-default-grid) { +@mixin grid-container($grid: $neat-grid) { &::after { clear: both; content: ""; diff --git a/core/neat/mixins/_grid-push.scss b/core/neat/mixins/_grid-push.scss index 3fcd97e1..6846268f 100644 --- a/core/neat/mixins/_grid-push.scss +++ b/core/neat/mixins/_grid-push.scss @@ -1,11 +1,11 @@ @charset "UTF-8"; /// Push or pull a Neat grid column. /// -/// @argument {number (unitless)} $push [false] +/// @argument {number (unitless)} $_push [false] /// -/// @argument {map} $grid [$neat-default-grid] +/// @argument {map} $_grid [$neat-grid] /// The grid to be used to generate the column. By default, the global -/// `$neat-default-grid` will be used. +/// `$neat-grid` will be used. /// /// @example scss /// .element { @@ -17,14 +17,14 @@ /// margin-left: calc((100% - (260px)) * 0.25 + 80px); /// } -@mixin grid-push($push: false, $grid: $neat-default-grid) { - $_grid-columns: map-get($grid, columns); - $_grid-gutter: map-get($grid, gutter); +@mixin grid-push($_push: false, $_grid: $neat-grid) { + $_grid-columns: _retrieve-neat-setting($_grid, columns); + $_grid-gutter: _retrieve-neat-setting($_grid, gutter); - @if $push { - $_push-column-ratio: $push / $_grid-columns; + @if $_push { + $_push-column-ratio: $_push / $_grid-columns; $_total-gutters: ($_grid-columns + 1) * $_grid-gutter; - $_gutter-affordance: $_grid-gutter * ($push + 1); + $_gutter-affordance: $_grid-gutter * ($_push + 1); $_total-columns: "(100% - #{$_total-gutters})"; $_margin-value: calc(#{unquote($_total-columns)} * #{$_push-column-ratio} + #{$_gutter-affordance}); diff --git a/core/neat/settings/_settings.scss b/core/neat/settings/_settings.scss index f7494198..dbeaeb44 100644 --- a/core/neat/settings/_settings.scss +++ b/core/neat/settings/_settings.scss @@ -11,7 +11,19 @@ /// /// @access private -$neat-default-grid: ( +$_neat-grid-defaults: ( columns: 12, gutter: 20px ); + +/// User overrides of Bourbon configuration settings. +/// +/// @type map +/// +/// @property {number (unitless)} columns [12] +/// Number of grid columns. +/// +/// @property {number (with unit)} gutter [20px] +/// Grid gutter width. + +$neat-grid: () !default;