From 6cec22b523ef167a6bf1f178994894e30efcfa87 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Patrick=20Heller=20=F0=9F=92=A9?= <ph@wacg.de>
Date: Sat, 4 Nov 2017 00:07:02 +0100
Subject: [PATCH] make tests green

---
 ...-output-with-explicit-screen-utilities.css |  2 +-
 src/lib/substituteResponsiveAtRules.js        | 28 +++++++++++--------
 2 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/__tests__/fixtures/tailwind-output-with-explicit-screen-utilities.css b/__tests__/fixtures/tailwind-output-with-explicit-screen-utilities.css
index 28f535ded..a04ced715 100644
--- a/__tests__/fixtures/tailwind-output-with-explicit-screen-utilities.css
+++ b/__tests__/fixtures/tailwind-output-with-explicit-screen-utilities.css
@@ -28,4 +28,4 @@
 
 .john {
   content: "wick";
-}
\ No newline at end of file
+}
diff --git a/src/lib/substituteResponsiveAtRules.js b/src/lib/substituteResponsiveAtRules.js
index 27b25cf4b..8697f0f77 100644
--- a/src/lib/substituteResponsiveAtRules.js
+++ b/src/lib/substituteResponsiveAtRules.js
@@ -7,11 +7,12 @@ import buildMediaQuery from '../util/buildMediaQuery'
 export default function(config) {
   return function (css) {
     const screens = config().screens
-    const rules = []
+    const responsiveRules = []
+    let finalRules = []
 
     css.walkAtRules('responsive', atRule => {
       const nodes = atRule.nodes
-      rules.push(...cloneNodes(nodes))
+      responsiveRules.push(...cloneNodes(nodes))
       atRule.before(nodes)
       atRule.remove()
     })
@@ -23,24 +24,27 @@ export default function(config) {
       })
 
       mediaQuery.append(
-        rules.map(rule => {
+        responsiveRules.map(rule => {
           const cloned = rule.clone()
           cloned.selectors = _.map(rule.selectors, selector => `.${screen}\\:${selector.slice(1)}`)
           return cloned
         })
       )
 
-      let includesScreenUtilitiesExplicitly = false
-      css.walkAtRules('tailwind', atRule => {
-        if (atRule.params === 'screen-utilities') {
-          includesScreenUtilitiesExplicitly = true
-          atRule.replaceWith(mediaQuery)
-        }
-      })
 
-      if(! includesScreenUtilitiesExplicitly) {
-        css.append(mediaQuery)
+      finalRules.push(mediaQuery)
+    })
+
+    let includesScreenUtilitiesExplicitly = false
+    css.walkAtRules('tailwind', atRule => {
+      if (atRule.params === 'screen-utilities') {
+        includesScreenUtilitiesExplicitly = true
+        atRule.replaceWith(finalRules)
       }
     })
+
+    if(! includesScreenUtilitiesExplicitly) {
+      css.append(finalRules)
+    }
   }
 }