RubyGems - wrgem - Versions diffs - 0.0.1 - Mend

wrgem 0.0.1

Files changed (1423) hide show

data/lib/generators/wrstart/template/vendor/assets/components/picturefill/gruntfile.js ADDED Viewed

@@ -0,0 +1,88 @@
+/*global module:true*/
+(function() {
+  "use strict";
+  var pkg;
+  module.exports = function(grunt) {
+    // Project configuration.
+    grunt.initConfig({
+      // Metadata.
+      pkg: pkg = grunt.file.readJSON("picturefill.json"),
+      banner: "/*! <%= pkg.title || pkg.name %> - v<%= pkg.version %> - " +
+        "<%= grunt.template.today('yyyy-mm-dd') %>\n" +
+        "<%= pkg.homepage ? '* ' + pkg.homepage + '\\n' : '' %>" +
+        "* Copyright (c) <%= grunt.template.today('yyyy') %> <%= pkg.author.name %>;" +
+        " Licensed <%= _.pluck(pkg.licenses, 'type').join(', ') %> */\n",
+      // Task configuration.
+      clean: {
+        files: [ "dist" ]
+      },
+      concat: {
+        options: {
+          banner: "<%= banner %>",
+          stripBanners: true
+        },
+        dist: {
+          src: [ "src/external/matchmedia.js", "src/picturefill.js" ],
+          dest: "dist/picturefill.js"
+        }
+      },
+      uglify: {
+        options: {
+          banner: "<%= banner %>"
+        },
+        dist: {
+          src: [ "<%= concat.dist.src %>" ],
+          dest: "dist/picturefill.min.js"
+        }
+      },
+      qunit: {
+        files: [ "tests/**/*.html" ]
+      },
+      jshint: {
+        all: {
+          options: {
+            jshintrc: true
+          },
+          src: [ "Gruntfile.js", "src/*.js", "tests/*.js" ]
+        }
+      },
+      jscs: {
+        all: {
+          src: "<%= jshint.all.src %>"
+        }
+      },
+      watch: {
+        gruntfile: {
+          files: [ "Gruntfile.js", "src/*.js", "tests/*.js" ],
+          tasks: [ "default" ]
+        }
+      }
+    });
+    // because the compress plugin is insane
+    grunt.task.registerTask( "compress", "compress the dist folder", function() {
+      var childProc = require("child_process");
+      var done = this.async();
+      childProc.exec( "zip -r dist-" + pkg.version + ".zip dist", function() {
+        done();
+      });
+    });
+    // These plugins provide necessary tasks.
+    grunt.loadNpmTasks("grunt-contrib-clean");
+    grunt.loadNpmTasks("grunt-contrib-concat");
+    grunt.loadNpmTasks("grunt-contrib-jshint");
+    grunt.loadNpmTasks("grunt-contrib-qunit");
+    grunt.loadNpmTasks("grunt-contrib-uglify");
+    grunt.loadNpmTasks("grunt-contrib-watch");
+    grunt.loadNpmTasks("grunt-jscs-checker");
+    // Default task.
+    grunt.registerTask("default", [ "test", "clean", "concat", "uglify" ]);
+    grunt.registerTask("test", [ "jscs", "jshint", "qunit" ]);
+  };
+})();

data/lib/generators/wrstart/template/vendor/assets/components/picturefill/index.html ADDED Viewed

@@ -0,0 +1,230 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset=utf-8 />
+		<meta name="viewport" content="width=device-width,initial-scale=1">
+		<title>Picturefill</title>
+		<link href='http://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css'>
+		<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400' rel='stylesheet' type='text/css'>
+		<link href='examples/styles.css' rel='stylesheet' type='text/css'>
+		<link href="https://raw.githubusercontent.com/ResponsiveImagesCG/responsiveimages.org/master/img/favicon.ico" rel="icon">
+		<script>
+			// Picture element HTML shim|v it for old IE (pairs with Picturefill.js)
+			document.createElement( "picture" );
+		</script>
+		<script async="true" src="dist/picturefill.js"></script>
+	</head>
+	<body>
+		<a href="http://responsiveimages.org/" class="ricg"><img src="https://raw.github.com/ResponsiveImagesCG/meta/master/logo/Web/RICG_logo_small.png"></a>
+		<h1>Picturefill <em>A responsive image polyfill</em></h1>
+		<nav>
+			<ul class="nav">
+				<li><a href="#download">Download</a></li>
+				<li><a href="#getting-started">Getting Started</a></li>
+				<li><a href="#examples">Examples</a></li>
+				<li><a href="#api">API</a></li>
+				<li><a href="#support">Browser support</a></li>
+				<li><a href="#contributing">Contributing</a></li>
+			</ul>
+		</nav>
+		<p>The <a href="http://picture.responsiveimages.org/">picture element</a> and associated features are W3C standard HTML features that allow web developers to deliver an appropriate image to every user depending on a variety of conditions like screen size, viewport size, screen resolution, and more. Picturefill is a JavaScript file (or a <em>polyfill</em> to be more specific) that enables support for the <code>picture</code> element and associated features in browsers that do not yet support them, so you can start using them today!</p>
+		<p>Picturefill is developed and maintained by <a href="http://filamentgroup.com"><img src="http://filamentgroup.com/images/fg-logo-icon-lrg.png" class="filament-logo" alt="Filament Group"></a>, with help from the members of the <a href="http://picture.responsiveimages.org/">Responsive Images Community Group</a> and the developer community at large. For Picturefill version 2, a special thanks goes to <a href="https://github.com/jansepar">Shawn Jansepar</a> for all his work on polyfilling the new spec.</p>
+		<h3 id="contributing">Contributing, Bug Reports, and More information</h3>
+		<p>For more information on the development of Picturefill, and how you can file bugs or contribute fixes, check out the the code project site on Github : <a href="https://github.com/scottjehl/picturefill">Picturefill on Github.</a></p>
+		<h2 id="download">Downloading Picturefill</h2>
+		<h3>Picturefill Version 2.1.0</h3>
+		<p>For native <code>picture</code> element support, you'll want Picturefill version 2. These downloads include the <a href="https://github.com/paulirish/matchMedia.js/">matchMedia polyfill</a> for browsers that need it (like IE9).</p>
+		<ul>
+			<li><a href="https://github.com/scottjehl/picturefill/blob/2.1.0/dist/picturefill.js">picturefill.js</a> (development version, unminified code)</li>
+			<li><a href="https://github.com/scottjehl/picturefill/blob/2.1.0/dist/picturefill.min.js">picturefill.min.js</a> (production version, minified code)</li>
+		</ul>
+		<h3>Version 1.2.1 (latest stable version)</h3>
+		<p>Version 1.2.1 of Picturefill is available if you are interested in the older markup pattern that uses <code>span</code> elements. This version is a lot lighter in weight than version 2 and allows for a fallback image in browsers that have JavaScript disabled (whereas Picturefill version 2 only offers <code>alt</code> text as a fallback for  non-JS browsers without <code>picture</code> support).</p>
+		<ul>
+			<li><a href="https://github.com/scottjehl/picturefill/blob/1.2.1/picturefill.js">Picturefill version 1.2.1</a></li>
+			<li><a href="https://github.com/scottjehl/picturefill/blob/1.2.1/README.md">Version 1.2.1 readme</a></li>
+		</ul>
+		<h2 id="getting-started">Getting Started with Picturefill Version 2</h2>
+		<p>For basic usage of Picturefill: download one of the files listed above and reference it from the <code>head</code> section of your HTML document with the following code:</p>
+<pre><code>&lt;script src=&quot;picturefill.js&quot;&gt;&lt;/script&gt;
+</code></pre>
+		<p>To allow your page to load more efficiently, we'd recommend adding an <code>async</code> attribute to that <code>script</code> tag as well. This tells the browser that it can load picturefill asynchronously, without waiting for it to finish before loading the rest of the document. If you add this attribute, you'll need to add a line of script before the <code>script</code> tag as well to allow older browsers to recognize <code>picture</code> elements if it encounters them in the page before picturefill has finished loading. </p>
+		<p><strong>Here's our recommended snippet:</strong></p>
+<pre><code>&lt;script&gt;
+// Picture element HTML5 shiv
+document.createElement( &quot;picture&quot; );
+&lt;/script&gt;
+&lt;script src=&quot;picturefill.js&quot; async&gt;&lt;/script&gt;
+</code></pre>
+		<p class="note">Note that if you are already including a recent version of the HTML5 Shiv (sometimes packaged with Modernizr), you may not need this line as it is included there as well. Also, more advanced users may not need this may choose to load Picturefill dynamically using a script loader like Require.js, (AMD and CommonJS support is included in the script).</p>
+		<h2 id="examples">Basic markup patterns</h2>
+		<p>Once you've included picturefill.js, you can start adding responsive image elements to your site. Picturefill adds support for both the <code>picture</code> element and also new responsive attributes to the <code>img</code> element. You may find that the new <code>img</code> features may be all you need. Let's cover those first.</p>
+		<h3 id="img-sizes">Using <code>img</code> with <code>srcset</code> &amp; <code>sizes</code> attributes</h3>
+		<p>The <code>sizes</code> syntax is used to define the size of the image across a number of breakpoints. <code>srcset</code> then defines an array of images and their inherent sizes. It's beyond the scope of this guide to get into much detail about how to use the new <code>srcset</code> &amp; <code>sizes</code> attributes, so we'd recommend reading the following post by Eric Portis: <a href="http://ericportis.com/posts/2014/srcset-sizes/">Srcset and Sizes</a>. Read that first, then check out the demos below!</p>
+		<h3>An img with "srcset" and sizes" attributes:</h3>
+<pre><code>&lt;img sizes=&quot;(min-width: 40em) 80vw, 100vw&quot;
+srcset=&quot;examples/images/medium.jpg 375w, examples/images/medium.jpg 480w, examples/images/large.jpg 768w&quot; alt=&quot;A giant stone face at The Bayon temple in Angkor Thom, Cambodia&quot;&gt;
+</code></pre>
+		<p>Here's how that renders in the browser. Feel free to resize to see it change.</p>
+		<img sizes="(min-width: 40em) 80vw, 100vw"
+				srcset="examples/images/medium.jpg 375w, examples/images/medium.jpg 480w, examples/images/large.jpg 768w" alt="A giant stone face at The Bayon temple in Angkor Thom, Cambodia">
+		<p><a href="examples/demo-01.html">View standalone demo</a></p>
+		<h2 id="using-picture">Using the <code>picture</code> element</h2>
+		<p>The <code>picture</code> element requires a little more markup than the example above, but it allows you to use features like CSS3 Media Queries to pair image sources with other layout conditions in your designs. </p>
+		<p>Your <code>picture</code> element should contain a series of <code>source</code> elements followed by an <code>img</code> element. Each <code>source</code> element must have a <code>srcset</code> attribute specifying one or more image url sources (which can use expanded srcset syntax if desired for resolution switching), and the <code>img</code> element should have a srcset attribute for fallback purposes as well (some browsers like Android 2.3's won't see the <code>source</code> elements). Additionally, you may add a  <code>media</code> attribute containing CSS3 Media Queries, and/or a <code>sizes</code> attribute to pair with <code>srcset</code>.</p>
+		<p>Here's one with <code>srcset</code> and <code>media</code>. The first <code>source</code> with a <code>media</code> attribute that matches the user’s context will determine the src of the <code>img</code> element at the end, so you’ll want to present larger options first when using <code>min-width</code> media queries (like in the examples below), and larger options last when using <code>max-width</code> media queries.</p>
+<pre><code>&lt;picture&gt;
+	&lt;source srcset=&quot;examples/images/extralarge.jpg&quot; media=&quot;(min-width: 1000px)&quot;&gt;
+	&lt;source srcset=&quot;examples/images/large.jpg&quot; media=&quot;(min-width: 800px)&quot;&gt;
+	&lt;img srcset=&quot;examples/images/medium.jpg&quot; alt=&quot;A giant stone face at The Bayon temple in Angkor Thom, Cambodia&quot;&gt;
+&lt;/picture&gt;
+</code></pre>
+		<h3 id="ie9">Supporting Picture in Internet Explorer 9</h3>
+		<p>While most versions of IE (even older ones!) are supported well, IE9 has a little conflict to work around. To support IE9, you will need to wrap a <code>video</code> element wrapper around the source elements in your <code>picture</code> tag. You can do this using conditional comments, like so:</p>
+<pre><code>&lt;picture&gt;
+	&lt;!--[if IE 9]&gt;&lt;video style=&quot;display: none;&quot;&gt;&lt;![endif]--&gt;
+	&lt;source srcset=&quot;examples/images/extralarge.jpg&quot; media=&quot;(min-width: 1000px)&quot;&gt;
+	&lt;source srcset=&quot;examples/images/large.jpg&quot; media=&quot;(min-width: 800px)&quot;&gt;
+	&lt;!--[if IE 9]&gt;&lt;/video&gt;&lt;![endif]--&gt;
+	&lt;img srcset=&quot;examples/images/medium.jpg&quot; alt=&quot;A giant stone face at The Bayon temple in Angkor Thom, Cambodia&quot;&gt;
+&lt;/picture&gt;
+</code></pre>
+		<p>Here's how that renders in the browser. Feel free to resize to see it change.</p>
+		<picture>
+			<!--[if IE 9]><video style="display: none;"><![endif]-->
+			<source srcset="examples/images/extralarge.jpg" media="(min-width: 1000px)">
+			<source srcset="examples/images/large.jpg" media="(min-width: 800px)">
+			<!--[if IE 9]></video><![endif]-->
+			<img srcset="examples/images/medium.jpg" alt="A giant stone face at The Bayon temple in Angkor Thom, Cambodia">
+		</picture>
+		<p><a href="examples/demo-02.html">View standalone demo</a></p>
+		<h2>More Picture markup examples</h2>
+		<h3 id="media-and-srcset"><code>media</code> and <code>srcset</code> syntax:</h3>
+		<p>The <code>1x</code>, <code>2x</code> syntax in <code>srcset</code> acts as a shorthand for more complex resolution media queries. When natively supported, <code>srcset</code> will allow the UA to override requests for higher-resolution options based on a bandwidth limitations or a user preference (see #9 in the <a href="http://usecases.responsiveimages.org/#h2_requirements">Responsive Images Use Cases and Requirements</a>).</p>
+<pre><code>&lt;picture&gt;
+	&lt;!--[if IE 9]&gt;&lt;video style=&quot;display: none;&quot;&gt;&lt;![endif]--&gt;
+	&lt;source srcset=&quot;examples/images/large.jpg, examples/images/extralarge.jpg 2x&quot; media=&quot;(min-width: 800px)&quot;&gt;
+	&lt;source srcset=&quot;examples/images/small.jpg, examples/images/medium.jpg 2x&quot;&gt;
+	&lt;!--[if IE 9]&gt;&lt;/video&gt;&lt;![endif]--&gt;
+	&lt;img srcset=&quot;examples/images/small.jpg, examples/images/medium.jpg 2x&quot; alt=&quot;A giant stone face at The Bayon temple in Angkor Thom, Cambodia&quot;&gt;
+&lt;/picture&gt;
+</code></pre>
+		<picture>
+			<!--[if IE 9]><video style="display: none;"><![endif]-->
+			<source srcset="examples/images/large.jpg, examples/images/extralarge.jpg 2x" media="(min-width: 800px)">
+			<source srcset="examples/images/small.jpg, examples/images/medium.jpg 2x">
+			<!--[if IE 9]></video><![endif]-->
+			<img srcset="examples/images/small.jpg, examples/images/medium.jpg 2x" alt="A giant stone face at The Bayon temple in Angkor Thom, Cambodia">
+		</picture>
+	<p><a href="examples/demo-03.html">View standalone demo</a></p>
+	<h3 id="types"><code>media</code> example with one webp source qualified with a <code>type</code> attribute.</h3>
+		<p>Note: Picturefill supports SVG and WebP types on any source element, and will disregard a <code>source</code> if its type is not supported in a particular environment:</p>
+<pre><code>&lt;picture&gt;
+	&lt;!--[if IE 9]&gt;&lt;video style=&quot;display: none;&quot;&gt;&lt;![endif]--&gt;
+	&lt;source srcset=&quot;examples/images/large.webp&quot; media=&quot;(min-width: 800px)&quot; type=&quot;image/webp&quot;&gt;
+	&lt;source srcset=&quot;examples/images/large.jpg&quot; media=&quot;(min-width: 800px)&quot;&gt;
+	&lt;source srcset=&quot;examples/images/medium.jpg&quot; media=&quot;(min-width: 400px)&quot;&gt;
+	&lt;!--[if IE 9]&gt;&lt;/video&gt;&lt;![endif]--&gt;
+	&lt;img srcset=&quot;examples/images/small.jpg&quot; alt=&quot;A giant stone face at The Bayon temple in Angkor Thom, Cambodia&quot;&gt;
+&lt;/picture&gt;
+</code></pre>
+		<picture>
+				<!--[if IE 9]><video style="display: none;"><![endif]-->
+				<source srcset="examples/images/large.webp" media="(min-width: 800px)" type="image/webp">
+				<source srcset="examples/images/large.jpg" media="(min-width: 800px)">
+				<source srcset="examples/images/medium.jpg" media="(min-width: 400px)">
+				<!--[if IE 9]></video><![endif]-->
+				<img srcset="examples/images/small.jpg" alt="A giant stone face at The Bayon temple in Angkor Thom, Cambodia">
+		</picture>
+		<p><a href="examples/demo-04.html">View standalone demo</a></p>
+		<h2 id="api">Picturefill JavaScript API</h2>
+		<p>Under ordinary circumstances, you likely won't need to do more than include picturefill.js in your page, but in some situations you may want to run picturefill's function manually yourself, and there are a few options to keep in mind:</p>
+		<h3>The picturefill function</h3>
+		<p>Picturefill.js exposes a single global function: the <code>picturefill()</code> function. <code>picturefill()</code> is automatically called one or more times while a page is loading, and it also is triggered when the browser window is resized (or on orientation change). You can run the <code>picturefill()</code> function at any time in JavaScript yourself as well, which may be useful after making updates to the DOM, or when conditions relevant to your application change:</p>
+<pre><code>
+picturefill();
+</code></pre>
+		<h3>Picturefill function options</h3>
+		<p>When running the <code>picturefill()</code> function, you can pass options specifying the following settings:</p>
+		<ul>
+			<li><strong>Elements:</strong> An array of <code>picture</code> and <code>img[srcset]</code> elements you'd like picturefill to evaluate. The Default value for <code>options.elements</code> is all <code>picture</code> and <code>img[srcset]</code> elements in the page.
+<pre><code>picturefill( {
+	elements: [ document.getElementById( "myPicture" ) ]
+} );
+</code></pre>
+			</li>
+			<li><strong>Reevaluate:</strong> Force picturefill to evaluate all elements in the <code>options.elements</code> array, even if they've already been evaluated. The default is <code>false</code>, except when a resize event triggers Picturefill to run (<code>options.reevaluate</code> is <code>true</code> in that case).
+<pre><code>picturefill( {
+	reevaluate: true
+} );
+</code></pre>
+			</li>
+		</ul>
+		<h2 id="support">Browser Support</h2>
+		<p>Picturefill supports a broad range of browsers and devices, provided that you stick with the standard markup conventions documented above. </p>
+		<h3 id="gotchas">Support caveats to keep in mind</h3>
+		<p>Picturefill is tested broadly and works in a large number of browsers. That said, it does have some browser support considerations to keep in mind:</p>
+		<ul>
+			<li><strong>JS-Disabled Browsers only see alt text:</strong> When using the <code>picture</code> element, non-<code>picture</code> supporting browsers will only see <code>alt</code> attribute text as a fallback when JavaScript fails or is disabled. This is because any <code>noscript</code>-based workarounds (such as the one used in Picturefill version 1) will cause future browsers that support the <code>picture</code> element to show two images instead of one when JavaScript is off. Unfortunately, choosing to add a <code>src</code> attribute to the <code>img</code> element in your <code>picture</code> element isn't a good workaround either, as any browser that exists today will fetch that <code>src</code> url even if it is not going to be used (which is wasteful). If you absolutely need an image to appear in non-JS environments, Picturefill 1.2 is a fine choice.</li>
+			<li><strong>Temporary extra HTTP Requests for Picture usage in some browsers:</strong> In browsers that natively support <code>srcset</code> but do not yet support the <code>picture</code> element, users may experience a wasted HTTP request for each <code>picture</code> element on a page. This is because the browser's preparser will fetch one of the URLs listed in the <code>picture</code> element's child <code>img</code>'s <code>srcset</code> attribute as soon as possible during page load, before the JavaScript can evaluate the potential <code>picture</code> <code>source</code> elements for a better match. This problem will only affect browsers that have implemented <code>srcset</code> but not <code>picture</code>, which will hopefully be short-lived.</li>
+			<li><strong>Source element limitations:</strong> Browsers like Android 2.3 and Internet Explorer 9 can not see the <code>source</code> elements inside a <code>picture</code> element. For IE, the <code>video</code> tag workaround helps us avoid this problem, but Android will still have no access to <code>source</code> elements. Be sure to provide a <code>srcset</code> attribute on your enclosed <code>img</code> to ensure an image will show in this browser.</li>
+			<li><strong>Media attribute support requires native media query support</strong>The <code>picture</code> element (paired with picturefill) works best in browsers that support CSS3 media queries. Picturefill includes  the <a href="https://github.com/paulirish/matchMedia.js/">matchMedia polyfill</a> by default, which makes matchMedia work in media query-supporting browsers that don’t support <code>matchMedia</code>.</li>
+		</ul>
+	</body>
+</html>

data/lib/generators/wrstart/template/vendor/assets/components/picturefill/package.json ADDED Viewed

@@ -0,0 +1,21 @@
+{
+	"name": "Picturefill",
+	"version": "0.0.0-ignored",
+	"engines": {
+		"node": ">= 0.8.0"
+	},
+	"scripts": {
+		"test": "grunt test --verbose"
+	},
+	"devDependencies": {
+		"grunt": "~0.4.2",
+		"grunt-cli": "~0.1",
+		"grunt-contrib-clean": "~0.4.0",
+		"grunt-contrib-concat": "~0.3.0",
+		"grunt-contrib-jshint": "~0.10.0",
+		"grunt-contrib-qunit": "~0.2.0",
+		"grunt-contrib-uglify": "~0.2.0",
+		"grunt-contrib-watch": "~0.4.0",
+		"grunt-jscs-checker": "~0.4.3"
+	}
+}

data/lib/generators/wrstart/template/vendor/assets/components/picturefill/picturefill.json ADDED Viewed

@@ -0,0 +1,22 @@
+{
+	"name": "Picturefill",
+	"title": "Picturefill",
+	"description": "A Polyfill for the HTML Picture Element (http://picture.responsiveimages.org/) that you can use today.",
+	"version": "2.1.0",
+	"homepage": "http://scottjehl.github.io/picturefill",
+	"author": {
+		"name": "https://github.com/scottjehl/picturefill/blob/master/Authors.txt",
+		"url": "https://github.com/scottjehl/picturefill"
+	},
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/scottjehl/picturefill.git"
+	},
+	"bugs": "https://github.com/scottjehl/picturefill/issues",
+	"licenses": [
+		{
+			"type": "MIT",
+			"url": "https://github.com/scottjehl/picturefill/blob/master/LICENSE"
+		}
+	]
+}

data/lib/generators/wrstart/template/vendor/assets/components/picturefill/src/external/matchmedia.js ADDED Viewed

@@ -0,0 +1,46 @@
+/*! matchMedia() polyfill - Test a CSS media type/query in JS. Authors & copyright (c) 2012: Scott Jehl, Paul Irish, Nicholas Zakas, David Knight. Dual MIT/BSD license */
+window.matchMedia || (window.matchMedia = function() {
+	"use strict";
+	// For browsers that support matchMedium api such as IE 9 and webkit
+	var styleMedia = (window.styleMedia || window.media);
+	// For those that don't support matchMedium
+	if (!styleMedia) {
+		var style       = document.createElement('style'),
+			script      = document.getElementsByTagName('script')[0],
+			info        = null;
+		style.type  = 'text/css';
+		style.id    = 'matchmediajs-test';
+		script.parentNode.insertBefore(style, script);
+		// 'style.currentStyle' is used by IE <= 8 and 'window.getComputedStyle' for all other browsers
+		info = ('getComputedStyle' in window) && window.getComputedStyle(style, null) || style.currentStyle;
+		styleMedia = {
+			matchMedium: function(media) {
+				var text = '@media ' + media + '{ #matchmediajs-test { width: 1px; } }';
+				// 'style.styleSheet' is used by IE <= 8 and 'style.textContent' for all other browsers
+				if (style.styleSheet) {
+					style.styleSheet.cssText = text;
+				} else {
+					style.textContent = text;
+				}
+				// Test if media query is true or false
+				return info.width === '1px';
+			}
+		};
+	}
+	return function(media) {
+		return {
+			matches: styleMedia.matchMedium(media || 'all'),
+			media: media || 'all'
+		};
+	};
+}());