sass-mq - npm Package Compare versions

Comparing version 5.0.0 to 5.0.1

package.json

 {
   "name": "sass-mq",
   "description": "mq() is a Sass mixin that helps manipulating media queries in an elegant way.",
-  "version": "5.0.0",
+  "version": "5.0.1",
   "keywords": [
@@ -57,6 +57,6 @@ "responsive",
   "devDependencies": {
-    "eyeglass": "^1.5.0",
-    "node-sass": "^4.9.0",
-    "sassdoc": "^2.5.0"
+    "eyeglass": "^2.4.1",
+    "node-sass": "^4.12.0",
+    "sassdoc": "^2.7.0"
   }
 }

README.md

@@ -0,7 +1,7 @@
+<div align="center">
+	<img width="500" height="500" src="https://avatars3.githubusercontent.com/u/9341289?v=3&s=500" alt="Awesome">
+</div>
+
 # Media Queries with superpowers [![Build Status](https://api.travis-ci.org/sass-mq/sass-mq.svg?branch=master)](https://travis-ci.org/sass-mq/sass-mq)
 
-![ ](https://avatars3.githubusercontent.com/u/9341289?v=3&s=300)
-
-----
-
 `mq()` is a [Sass](http://sass-lang.com/ "Sass - Syntactically Awesome
@@ -53,5 +53,2 @@ Stylesheets") mixin that helps you compose media queries in an elegant
 
-----
-
-
 ## How to use it
@@ -63,8 +60,9 @@
 
-1. Install with [Bower](http://bower.io/ "Bower: A package manager for the web"): `bower install sass-mq --save`
+1. Install:
+    - with [Bower](http://bower.io/ "Bower: A package manager for the web"): `bower install sass-mq --save`
+    - with [npm](https://www.npmjs.com/): `npm install sass-mq --save` _supports [eyeglass](https://github.com/sass-eyeglass/eyeglass)_
+    - with [yarn](https://www.yarnpkg.com/): `yarn add sass-mq` _supports [eyeglass](https://github.com/sass-eyeglass/eyeglass)_
 
-    OR Install with [npm](https://www.npmjs.com/): `npm install sass-mq --save` _it supports [eyeglass](https://github.com/sass-eyeglass/eyeglass)_
+    OR [Download _mq.scss](https://raw.github.com/sass-mq/sass-mq/master/_mq.scss) into your Sass project.
 
-    OR [Download _mq.scss](https://raw.github.com/sass-mq/sass-mq/master/_mq.scss) to your Sass project.
-
 2. Import the partial in your Sass files and override default settings
@@ -95,3 +93,3 @@ with your own preferences before the file is imported:
     // be used as the target width when outputting a static stylesheet
-    // (i.e. when $mq-responsive is set to 'false').
+    // (when $mq-responsive is set to 'false').
     $mq-static-breakpoint: desktop;
@@ -101,8 +99,11 @@
     // right corner of your site during development, add the breakpoints
-    // to this list, ordered by width, e.g. (mobile, tablet, desktop).
+    // to this list, ordered by width. For example: (mobile, tablet, desktop).
     $mq-show-breakpoints: (mobile, mobileLandscape, tablet, desktop, wide);
 
+    // If _mq.scss is in your project:
     @import 'path/to/mq';
     // With eyeglass:
-    // @import 'sass-mq';
+    @import 'sass-mq';
+    // With webpack (and boilerplates such as create-react-app)
+    @import '~sass-mq';
     ```
@@ -192,3 +193,3 @@ 3. Play around with `mq()` (see below)
 
-Sometimes you’ll want to be extra verbose (e.g. if you’re developing a
+Sometimes you’ll want to be extra verbose (for example, if you’re developing a
 library based on top of sass-mq), however for readability in a codebase,
@@ -254,2 +255,7 @@ the shorthand notation is recommended.
 
+```scss
+// Adapt the list to include breakpoint names from your project
+$mq-show-breakpoints: (phone, phablet, tablet);
+```
+
 ![$mq-show-breakpoints](https://raw.githubusercontent.com/sass-mq/sass-mq/master/show-breakpoints.gif)
@@ -342,2 +348,3 @@
 - [Shopify Polaris](https://polaris.shopify.com)
+- [Taylor / Thomas](https://www.taylorthomas.co.uk/)
 - You? [Open an issue](https://github.com/sass-mq/sass-mq/issues/new?title=My%20company%20uses%20Sass%20MQ&body=Hi,%20we%27re%20using%20Sass%20MQ%20at%20[name%20of%20your%20company]%20and%20we%27d%20like%20to%20be%20mentionned%20in%20the%20README%20of%20the%20project.%20Cheers!)
@@ -344,0 +351,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

24438

increased by5.24%

Number of lines in readme file

349

increased by2.05%

No dependency changes