Merge pull request #233 from ember-learn/upgrade-tailwind

Upgrade tailwind

Author: samselikoff

addon/tailwind/config/tailwind.js

@@ -1,13 +1,15 @@
-'use strict';
-
 import colors from './colors';
 import screens from './screens';
 import fonts from './fonts';
 import textSizes from './text-sizes';
 import fontWeights from './font-weights';
 import leading from './line-height';
 import tracking from './letter-spacing';
+import textColors from './text-colors';
+import backgroundColors from './background-colors';
+import backgroundSize from './background-size';
 import borderWidths from './border-widths';
+import borderColors from './border-colors';
 import borderRadius from './border-radius';
 import width from './width';
 import height from './height';
@@ -33,10 +35,11 @@ export default {
   fontWeights,
   leading,
   tracking,
-  textColors: colors,
-  backgroundColors: colors,
+  textColors,
+  backgroundColors,
+  backgroundSize,
   borderWidths,
-  borderColors: Object.assign({ default: colors['grey-light'] }, colors),
+  borderColors,
   borderRadius,
   width,
   height,
@@ -101,6 +104,22 @@ export default {
     zIndex: ['responsive'],
   },
 
+  /*
+  |-----------------------------------------------------------------------------
+  | Plugins                                https://tailwindcss.com/docs/plugins
+  |-----------------------------------------------------------------------------
+  |
+  | Here is where you can register any plugins you'd like to use in your
+  | project. Tailwind's built-in `container` plugin is enabled by default to
+  | give you a Bootstrap-style responsive container component out of the box.
+  |
+  | Be sure to view the complete plugin documentation to learn more about how
+  | the plugin system works.
+  |
+  */
+   plugins: [
+  ],
+
   /*
   |-----------------------------------------------------------------------------
   | Advanced Options         https://tailwindcss.com/docs/configuration#options

addon/tailwind/modules.css

@@ -1,62 +1,5 @@
-/**
- * This injects Tailwind's base styles, which is a combination of
- * Normalize.css and some additional base styles.
- *
- * You can see the styles here:
- * https://github.com/tailwindcss/tailwindcss/blob/master/css/preflight.css
- *
- * If using `postcss-import`, you should import this line from it's own file:
- *
- * @import "./tailwind-preflight.css";
- *
- * See: https://github.com/tailwindcss/tailwindcss/issues/53#issuecomment-341413622
- */
-@import "./tailwind-preflight.css";
-
-/**
- * Here you would add any of your custom component classes; stuff that you'd
- * want loaded *before* the utilities so that the utilities could still
- * override them.
- *
- * Example:
- *
- * .btn { ... }
- * .form-input { ... }
- *
- * Or if using a preprocessor or `postcss-import`:
- *
- * @import "components/buttons";
- * @import "components/forms";
-**/
-
+@import "tailwindcss/preflight";
+@import "tailwindcss/components";
 @import "./components/*.css";
-
-
-/**
- * This injects all of Tailwind's utility classes, generated based on your
- * config file.
- *
- * If using `postcss-import`, you should import this line from it's own file:
- *
- * @import "./tailwind-utilities.css";
- *
- * See: https://github.com/tailwindcss/tailwindcss/issues/53#issuecomment-341413622
- */
-
-@import "./tailwind-utilities.css";
-
-/**
- * Here you would add any custom utilities you need that don't come out of the
- * box with Tailwind.
- *
- * Example :
- *
- * .bg-pattern-graph-paper { ... }
- * .skew-45 { ... }
- *
- * Or if using a preprocessor or `postcss-import`:
- *
- * @import "utilities/background-patterns";
- * @import "utilities/skew-transforms";
-**/
+@import "tailwindcss/utilities";
 @import "./utilities/*.css";

addon/tailwind/tailwind-preflight.css

@@ -33,9 +33,6 @@ module.exports = {
         'node_modules/ember-cli-addon-docs/public',
         'tests/dummy/public'
       ]
-    },
-    'ember-cli-tailwind': {
-      buildTarget: 'addon'
     }
   },
 
@@ -56,6 +53,9 @@ module.exports = {
         latestVersionName: LATEST_VERSION_NAME,
         deployVersion: 'ADDON_DOCS_DEPLOY_VERSION',
         searchTokenSeparator: "\\s+"
+      },
+      'ember-cli-tailwind': {
+        shouldIncludeStyleguide: false
       }
     };
 

addon/tailwind/tailwind-utilities.css

@@ -41,7 +41,7 @@
     "ember-cli-htmlbars-inline-precompile": "^1.0.2",
     "ember-cli-sass": "7.1.3",
     "ember-cli-string-helpers": "^1.7.0",
-    "ember-cli-tailwind": "^0.4.1",
+    "ember-cli-tailwind": "^0.6.1",
     "ember-code-snippet": "^2.2.0",
     "ember-component-css": "^0.3.5",
     "ember-concurrency": "^0.8.16",