From faccfdb4bfd3c8d3fde6190337edd37f28f2ef49 Mon Sep 17 00:00:00 2001
From: Raphael Goetter <raphael@goetter.fr>
Date: Fri, 21 Apr 2017 22:40:35 +0200
Subject: [PATCH] =?UTF-8?q?am=C3=A9lioration=20du=20mixant=20"respond-to()?=
 =?UTF-8?q?"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 bower.json                |  2 +-
 changelog.md              |  3 ++
 package.json              |  2 +-
 sass/_config/_mixins.scss | 66 ++++++++++++++++-----------------------
 sass/knacss.scss          |  2 +-
 5 files changed, 33 insertions(+), 42 deletions(-)

diff --git a/bower.json b/bower.json
index f85604e..d62bb94 100644
--- a/bower.json
+++ b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "KNACSS",
-  "version": "6.1.0",
+  "version": "6.1.1",
   "homepage": "http://www.knacss.com/",
   "authors": [
     "Raphaël GOETTER, Alsacreations"
diff --git a/changelog.md b/changelog.md
index 51729c0..8a7578c 100644
--- a/changelog.md
+++ b/changelog.md
@@ -1,3 +1,6 @@
+# changelog v6.1.1 (21 avril 2017)
+- amélioration du mixin "respond-to()"
+
 # changelog v6.1.0 (3 mars 2017)
 - passage à [Normalize 5.0.0](https://github.com/necolas/normalize.css/blob/5.0.0/CHANGELOG.md)
 - ajout de variables pour tailles de polices différentes sur petits et sur grands écrans (`$h1-size` et `$h1-size-l` par exemple). Par défaut, les tailles "mobile" sont appliquées, et les tailles "desktop" s'appliquent en min-width `$tiny +1`
diff --git a/package.json b/package.json
index 0341e4c..ee31f79 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "knacss",
-  "version": "6.1.0",
+  "version": "6.1.1",
   "homepage": "http://www.knacss.com/",
   "bugs": "https://github.com/alsacreations/KNACSS/issues",
   "author": [
diff --git a/sass/_config/_mixins.scss b/sass/_config/_mixins.scss
index e9408bf..b2ef897 100644
--- a/sass/_config/_mixins.scss
+++ b/sass/_config/_mixins.scss
@@ -1,44 +1,32 @@
 // Additionnal "utility" breakpoints aliases
 // ex. @include respond-to("medium-up") {...}
-@function breakpoint($bp) {
-  @if $bp == 'tiny' {
-    @return '(max-width: #{$tiny})';
-  }
-  @else if $bp == 'small' {
-    @return '(max-width: #{$small})';
-  }
-  @else if $bp == 'medium' {
-    @return '(max-width: #{$medium})';
-  }
-  @else if $bp == 'large' {
-    @return '(max-width: #{$large})';
-  }
-  @else if $bp == 'extra-large' {
-    @return '(max-width: #{$extra-large})';
-  }
-  @else if $bp == 'tiny-up' {
-    @return '(min-width: #{$tiny + 1})';
-  }
-  @else if $bp == 'small-up' {
-    @return '(min-width: #{$small + 1})';
-  }
-  @else if $bp == 'medium-up' {
-    @return '(min-width: #{$medium + 1})';
-  }
-  @else if $bp == 'large-up' {
-    @return '(min-width: #{$large + 1})';
-  }
-  @else if $bp == 'extra-large-up' {
-    @return '(min-width: #{$extra-large + 1})';
-  }
-  @else if $bp == 'retina' {
-    @return '(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx)';
-  }
-}
+$bp-aliases: (
+  'tiny'   : (max-width: #{$tiny}),
+  'small'  : (max-width: #{$small}),
+  'medium' : (max-width: #{$medium}),
+  'large' : (max-width: #{$large}),
+  'extra-large'  : (max-width: #{$extra-large}),
+  'tiny-up'   : (min-width: #{$tiny + 1}),
+  'small-up'  : (min-width: #{$small + 1}),
+  'medium-up' : (min-width: #{$medium + 1}),
+  'large-up' : (min-width: #{$large + 1}),
+  'extra-large-up' : (min-width: #{$extra-large + 1}),
+  'retina' : (min-resolution: 2dppx)
+);
 
-@mixin respond-to($value) {
-  $string: breakpoint($value);
-  @media screen and #{$string} {
-    @content;
+// Source : https://www.sitepoint.com/managing-responsive-breakpoints-sass/
+@mixin respond-to($name) {
+  // If the key exists in the map
+  @if map-has-key($bp-aliases, $name) {
+    // Prints a media query based on the value
+    @media #{inspect(map-get($bp-aliases, $name))} {
+      @content;
+    }
+  }
+
+  // If the key doesn't exist in the map
+  @else {
+    @warn "Unfortunately, no value could be retrieved from `#{$breakpoint}`. "
+        + "Please make sure it is defined in `$breakpoints` map.";
   }
 }
diff --git a/sass/knacss.scss b/sass/knacss.scss
index ab928d4..194fc1f 100644
--- a/sass/knacss.scss
+++ b/sass/knacss.scss
@@ -1,5 +1,5 @@
 /*!
-* www.KNACSS.com V6.0.5 (1er décembre 2016) @author: Alsacreations, Raphael Goetter
+* www.KNACSS.com v6.1.1 (21 avril 2017) @author: Alsacreations, Raphael Goetter
 * Licence WTFPL http://www.wtfpl.net/
 */