guff-compass 0.7.0

data/demo/bower_components/jquery/test/unit/wrap.js

@@ -0,0 +1,265 @@
+(function() {
+
+if ( !jQuery.fn.wrap ) { // no wrap module
+	return;
+}
+
+module( "wrap", {
+	teardown: moduleTeardown
+});
+
+// See test/unit/manipulation.js for explanation about these 2 functions
+function manipulationBareObj( value ) {
+	return value;
+}
+
+function manipulationFunctionReturningObj( value ) {
+	return function() {
+		return value;
+	};
+}
+
+function testWrap( val ) {
+
+	expect( 19 );
+
+	var defaultText, result, j, i, cacheLength;
+
+	defaultText = "Try them out:";
+	result = jQuery("#first").wrap( val("<div class='red'><span></span></div>") ).text();
+
+	equal( defaultText, result, "Check for wrapping of on-the-fly html" );
+	ok( jQuery("#first").parent().parent().is(".red"), "Check if wrapper has class 'red'" );
+
+	QUnit.reset();
+	result = jQuery("#first").wrap( val(document.getElementById("empty")) ).parent();
+	ok( result.is("ol"), "Check for element wrapping" );
+	equal( result.text(), defaultText, "Check for element wrapping" );
+
+	QUnit.reset();
+	jQuery("#check1").on( "click", function() {
+		var checkbox = this;
+
+		ok( checkbox.checked, "Checkbox's state is erased after wrap() action, see #769" );
+		jQuery( checkbox ).wrap( val("<div id='c1' style='display:none;'></div>") );
+		ok( checkbox.checked, "Checkbox's state is erased after wrap() action, see #769" );
+	}).prop( "checked", false )[ 0 ].click();
+
+	// using contents will get comments regular, text, and comment nodes
+	j = jQuery("#nonnodes").contents();
+	j.wrap( val("<i></i>") );
+
+	// Blackberry 4.6 doesn't maintain comments in the DOM
+	equal( jQuery("#nonnodes > i").length, jQuery("#nonnodes")[ 0 ].childNodes.length, "Check node,textnode,comment wraps ok" );
+	equal( jQuery("#nonnodes > i").text(), j.text(), "Check node,textnode,comment wraps doesn't hurt text" );
+
+	// Try wrapping a disconnected node
+	cacheLength = 0;
+	for ( i in jQuery.cache ) {
+		cacheLength++;
+	}
+
+	j = jQuery("<label/>").wrap( val("<li/>") );
+	equal( j[ 0 ] .nodeName.toUpperCase(), "LABEL", "Element is a label" );
+	equal( j[ 0 ].parentNode.nodeName.toUpperCase(), "LI", "Element has been wrapped" );
+
+	for ( i in jQuery.cache ) {
+		cacheLength--;
+	}
+	equal( cacheLength, 0, "No memory leak in jQuery.cache (bug #7165)" );
+
+	// Wrap an element containing a text node
+	j = jQuery("<span/>").wrap("<div>test</div>");
+	equal( j[ 0 ].previousSibling.nodeType, 3, "Make sure the previous node is a text element" );
+	equal( j[ 0 ].parentNode.nodeName.toUpperCase(), "DIV", "And that we're in the div element." );
+
+	// Try to wrap an element with multiple elements (should fail)
+	j = jQuery("<div><span></span></div>").children().wrap("<p></p><div></div>");
+	equal( j[ 0 ].parentNode.parentNode.childNodes.length, 1, "There should only be one element wrapping." );
+	equal( j.length, 1, "There should only be one element (no cloning)." );
+	equal( j[ 0 ].parentNode.nodeName.toUpperCase(), "P", "The span should be in the paragraph." );
+
+	// Wrap an element with a jQuery set
+	j = jQuery("<span/>").wrap( jQuery("<div></div>") );
+	equal( j[ 0 ].parentNode.nodeName.toLowerCase(), "div", "Wrapping works." );
+
+	// Wrap an element with a jQuery set and event
+	result = jQuery("<div></div>").on( "click", function() {
+		ok( true, "Event triggered." );
+
+		// Remove handlers on detached elements
+		result.off();
+		jQuery(this).off();
+	});
+
+	j = jQuery("<span/>").wrap( result );
+	equal( j[ 0 ].parentNode.nodeName.toLowerCase(), "div", "Wrapping works." );
+
+	j.parent().trigger("click");
+
+	// clean up attached elements
+	QUnit.reset();
+}
+
+test( "wrap(String|Element)", function() {
+	testWrap( manipulationBareObj );
+});
+
+test( "wrap(Function)", function() {
+	testWrap( manipulationFunctionReturningObj );
+});
+
+test( "wrap(Function) with index (#10177)", function() {
+	var expectedIndex = 0,
+		targets = jQuery("#qunit-fixture p");
+
+	expect( targets.length );
+	targets.wrap(function(i) {
+		equal( i, expectedIndex, "Check if the provided index (" + i + ") is as expected (" + expectedIndex + ")" );
+		expectedIndex++;
+
+		return "<div id='wrap_index_'" + i + "'></div>";
+	});
+});
+
+test( "wrap(String) consecutive elements (#10177)", function() {
+	var targets = jQuery("#qunit-fixture p");
+
+	expect( targets.length * 2 );
+	targets.wrap("<div class='wrapper'></div>");
+
+	targets.each(function() {
+		var $this = jQuery(this);
+
+		ok( $this.parent().is(".wrapper"), "Check each elements parent is correct (.wrapper)" );
+		equal( $this.siblings().length, 0, "Each element should be wrapped individually" );
+	});
+});
+
+function testWrapAll( val ) {
+
+	expect( 8 );
+
+	var prev, p, result;
+
+	prev = jQuery("#firstp")[ 0 ].previousSibling;
+	p = jQuery("#firstp,#first")[ 0 ].parentNode;
+	result = jQuery("#firstp,#first").wrapAll( val("<div class='red'><div class='tmp'></div></div>") );
+
+	equal( result.parent().length, 1, "Check for wrapping of on-the-fly html" );
+	ok( jQuery("#first").parent().parent().is(".red"), "Check if wrapper has class 'red'" );
+	ok( jQuery("#firstp").parent().parent().is(".red"), "Check if wrapper has class 'red'" );
+	equal( jQuery("#first").parent().parent()[ 0 ].previousSibling, prev, "Correct Previous Sibling" );
+	equal( jQuery("#first").parent().parent()[ 0 ].parentNode, p, "Correct Parent" );
+
+	QUnit.reset();
+	prev = jQuery("#firstp")[ 0 ].previousSibling;
+	p = jQuery("#first")[ 0 ].parentNode;
+	jQuery("#firstp,#first").wrapAll( val(document.getElementById("empty")) );
+
+	equal( jQuery("#first").parent()[ 0 ], jQuery("#firstp").parent()[ 0 ], "Same Parent" );
+	equal( jQuery("#first").parent()[ 0 ].previousSibling, prev, "Correct Previous Sibling" );
+	equal( jQuery("#first").parent()[ 0 ].parentNode, p, "Correct Parent" );
+}
+
+test( "wrapAll(String|Element)", function() {
+	testWrapAll( manipulationBareObj );
+});
+
+function testWrapInner( val ) {
+
+	expect( 11 );
+
+	var num, div;
+
+	num = jQuery("#first").children().length;
+	jQuery("#first").wrapInner( val("<div class='red'><div id='tmp'></div></div>") );
+
+	equal( jQuery("#first").children().length, 1, "Only one child" );
+	ok( jQuery("#first").children().is(".red"), "Verify Right Element" );
+	equal( jQuery("#first").children().children().children().length, num, "Verify Elements Intact" );
+
+	QUnit.reset();
+	num = jQuery("#first").html("foo<div>test</div><div>test2</div>").children().length;
+	jQuery("#first").wrapInner( val("<div class='red'><div id='tmp'></div></div>") );
+	equal( jQuery("#first").children().length, 1, "Only one child" );
+	ok( jQuery("#first").children().is(".red"), "Verify Right Element" );
+	equal( jQuery("#first").children().children().children().length, num, "Verify Elements Intact" );
+
+	QUnit.reset();
+	num = jQuery("#first").children().length;
+	jQuery("#first").wrapInner( val(document.getElementById("empty")) );
+	equal( jQuery("#first").children().length, 1, "Only one child" );
+	ok( jQuery("#first").children().is("#empty"), "Verify Right Element" );
+	equal( jQuery("#first").children().children().length, num, "Verify Elements Intact" );
+
+	div = jQuery("<div/>");
+	div.wrapInner( val("<span></span>") );
+	equal( div.children().length, 1, "The contents were wrapped." );
+	equal( div.children()[ 0 ].nodeName.toLowerCase(), "span", "A span was inserted." );
+}
+
+test( "wrapInner(String|Element)", function() {
+	testWrapInner( manipulationBareObj );
+});
+
+test( "wrapInner(Function)", function() {
+	testWrapInner( manipulationFunctionReturningObj );
+});
+
+test( "unwrap()", function() {
+
+	expect( 9 );
+
+	jQuery("body").append("  <div id='unwrap' style='display: none;'> <div id='unwrap1'> <span class='unwrap'>a</span> <span class='unwrap'>b</span> </div> <div id='unwrap2'> <span class='unwrap'>c</span> <span class='unwrap'>d</span> </div> <div id='unwrap3'> <b><span class='unwrap unwrap3'>e</span></b> <b><span class='unwrap unwrap3'>f</span></b> </div> </div>");
+
+	var abcd = jQuery("#unwrap1 > span, #unwrap2 > span").get(),
+		abcdef = jQuery("#unwrap span").get();
+
+	equal( jQuery("#unwrap1 span").add("#unwrap2 span:first-child").unwrap().length, 3, "make #unwrap1 and #unwrap2 go away" );
+	deepEqual( jQuery("#unwrap > span").get(), abcd, "all four spans should still exist" );
+
+	deepEqual( jQuery("#unwrap3 span").unwrap().get(), jQuery("#unwrap3 > span").get(), "make all b in #unwrap3 go away" );
+
+	deepEqual( jQuery("#unwrap3 span").unwrap().get(), jQuery("#unwrap > span.unwrap3").get(), "make #unwrap3 go away" );
+
+	deepEqual( jQuery("#unwrap").children().get(), abcdef, "#unwrap only contains 6 child spans" );
+
+	deepEqual( jQuery("#unwrap > span").unwrap().get(), jQuery("body > span.unwrap").get(), "make the 6 spans become children of body" );
+
+	deepEqual( jQuery("body > span.unwrap").unwrap().get(), jQuery("body > span.unwrap").get(), "can't unwrap children of body" );
+	deepEqual( jQuery("body > span.unwrap").unwrap().get(), abcdef, "can't unwrap children of body" );
+
+	deepEqual( jQuery("body > span.unwrap").get(), abcdef, "body contains 6 .unwrap child spans" );
+
+	jQuery("body > span.unwrap").remove();
+});
+
+test( "jQuery(<tag>) & wrap[Inner/All]() handle unknown elems (#10667)", function() {
+
+	expect( 2 );
+
+	var $wraptarget = jQuery( "<div id='wrap-target'>Target</div>" ).appendTo( "#qunit-fixture" ),
+		$section = jQuery( "<section>" ).appendTo( "#qunit-fixture" );
+
+	$wraptarget.wrapAll("<aside style='background-color:green'></aside>");
+
+	notEqual( $wraptarget.parent("aside").get( 0 ).style.backgroundColor, "transparent", "HTML5 elements created with wrapAll inherit styles" );
+	notEqual( $section.get( 0 ).style.backgroundColor, "transparent", "HTML5 elements create with jQuery( string ) inherit styles" );
+});
+
+test( "wrapping scripts (#10470)", function() {
+
+	expect( 2 );
+
+	var script = document.createElement("script");
+	script.text = script.textContent = "ok( !document.eval10470, 'script evaluated once' ); document.eval10470 = true;";
+
+	document.eval10470 = false;
+	jQuery("#qunit-fixture").empty()[0].appendChild( script );
+	jQuery("#qunit-fixture script").wrap("<b></b>");
+	strictEqual( script.parentNode, jQuery("#qunit-fixture > b")[ 0 ], "correctly wrapped" );
+	jQuery( script ).remove();
+});
+
+})();

data/demo/bower_components/jquery/test/xhtml.php

@@ -0,0 +1,5 @@
+<?php
+	# Load and run the test suite as a proper XHTML page
+	header("Content-type: application/xhtml+xml");
+	readfile("index.html");
+?>

data/demo/index.html

@@ -0,0 +1,347 @@
+<!doctype html>
+<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
+<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
+<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
+<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
+    <head>
+        <meta charset="utf-8">
+        <title>GUFF</title>
+        <meta name="description" content="Structure Style Guide">
+        <meta name="viewport" content="width=device-width">
+        <link rel="stylesheet" href="styles/main.css">
+        <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/modernizr/2.7.1/modernizr.min.js
+
+"></script>
+    </head>
+    <body>
+        <header class="primary">
+        <h1>GUFF</h1>
+        <p>Lets keep this shit simple.</p>
+        </header>
+        <main>
+            <section>
+                <header>
+                    <h2>CSS Reset Mixin</h2>
+                </header>
+                <code class="prettyprint">
+@include reset;
+                </code>
+            </section>
+            <section>
+                <header>
+                    <h2>Breakpoint Mixin</h2>
+                </header>
+                <code class="prettyprint">
+$desktop: "(min-width: 1024px)";
+
+div {
+    @include breakpoint($desktop){
+        width: 100%;
+    }
+}
+                </code>
+                <p>Renders the following media query:</p>
+                <code class="prettyprint">
+@media (min-width: 1024px) {
+    div {
+        width: 100%;
+    }
+}
+                </code>
+            </section>
+            <section>
+                <header>
+                    <h2>Container Mixin</h2>
+                </header>
+                <code class="prettyprint">
+// Use on divs wrapping span mixins
+
+.container {
+    @include container;
+}
+                </code>
+                <code class="prettyprint">
+// Use on divs wrapping col mixins
+
+.container {
+    @include col-container;
+}
+                </code>
+            </section>
+            <section>
+                <header>
+                    <h2>Span Mixin</h2>
+                </header>
+                <code class="prettyprint">
+// cols : int - Column count
+// padding : boolean - Use grid padding : optional
+
+@include span(cols, padding);
+                </code>
+                <div class="container">
+                    <div class="float-tile"></div>
+                    <div class="float-tile"></div>
+                    <div class="float-tile"></div>
+                </div>
+                <code class="prettyprint">
+// Requires container with container() mixin
+// Use span function to just get width
+
+.tile {
+    @include span(4);
+}
+                </code>
+            </section>
+            <section>
+                <header>
+                    <h2>Col Mixin</h2>
+                </header>
+                <code class="prettyprint">
+// Creates columns with margins using the justify method
+// cols : int - Column count
+
+@include col(cols);
+                </code>
+                <div class="col-container">
+                    <div class="col-tile"></div>
+                    <div class="col-tile"></div>
+                    <div class="col-tile"></div>
+                </div>
+                <code class="prettyprint">
+// Requires a container with col-container mixin
+
+.col {
+    @include col(4);
+}
+                </code>
+            </section>
+            <section>
+                <header>
+                    <h2>Offset Mixin</h2>
+                </header>
+                <code class="prettyprint">
+// cols : int - Column count
+
+@include offset(cols);
+                </code>
+                <div class="container">
+                    <div class="float-tile offset-tile">
+
+                    </div>
+                </div>
+                <code class="prettyprint">
+.tile.offset-tile {
+    @include @offset(4);
+}
+                </code>
+            </section>
+            <section>
+                <header>
+                    <h2>Span Function</h2>
+                </header>
+                <code class="prettyprint">
+// Use to simply get column width
+
+.tile-no-float {
+    width: span(4);
+    margin-left: span(2);
+}
+                </code>
+            </section>
+            <section>
+                <header>
+                    <h2>Prefix Mixins</h2>
+                </header>
+                <code class="prettyprint">
+// Generates browser prefixes for properties
+
+// Transistion
+@include transition(all 1s linear);
+
+// Transform
+@include transform(translateZ(0));
+
+// Box Sizing
+@include box-sizing(border-box);
+
+// Anything you want
+@include prefixer(text-shadow, 5px, webkit moz);
+
+                </code>
+            </section>
+            <section>
+                <header>
+                    <h2>rem-calc()</h2>
+                </header>
+                <code class="prettyprint">
+// Calculates rem value for px value
+
+font-size: rem-calc(14);
+                </code>
+            </section>
+            <section>
+                <header>
+                    <h2>Helper Mixins</h2>
+                </header>
+                <code class="prettyprint">
+// Clearfix Mixin
+//
+// &:after {
+// content:"";
+//  display:table;
+//  clear:both;
+// }
+//
+
+@include clear;
+
+// clear(boolean) : Use false inside media queries to use mixin instead of placeholder
+
+@include clear(false);
+
+// Ellipsis Mixin - ellipsis($width)
+//
+// display: inline-block;
+// max-width: $width;
+// overflow: hidden;
+// text-overflow: ellipsis;
+// white-space: nowrap;
+//
+
+@include ellipsis(200px);
+
+// Hide Text
+//
+// overflow:hidden;
+// text-indent: 100%;
+// white-space: nowrap;
+//
+
+@include hide-text;
+
+// hide-text(boolean) : Use false inside media queries to use mixin instead of placeholder
+
+@include hide-text(false);
+
+// Inline List (use on &lt;ul&gt;)
+//
+// list-style-type:none;
+// padding:0;
+//  margin:0;
+//  overflow:hidden;
+//  > li{
+//      display:block;
+//      float:left;
+//  }
+
+@include inline-list;
+
+// Pass false to render list items as inline-block instead of float
+
+@include inline-list(false);
+
+                </code>
+            </section>
+            <section class="typography">
+                <header>
+                    <h2>Typographic Rhythm</h2>
+                </header>
+                <code class="prettyprint">
+// Uses the following variable settings
+//
+// $rem-base - base rem size in px
+// $line-height-base - line height base
+// $type-rhythm-ratio - header scaling ratio
+
+@include type(16px, 26px, 1.14);
+
+@include type(16px, 1.5, 1.14);
+
+// No arguments required, falls back to settings variables
+
+@include type;
+                </code>
+                <h1>H1</h1>
+                <h2>H2</h2>
+                <h3>H3</h3>
+                <h4>H4</h4>
+                <h5>H5</h5>
+                <h6>H6</h6>
+                <p>Paragraph</p>
+            </section>
+            <section>
+                <header>
+                    <h2>Installation</h2>
+                </header>
+                <code class="prettyprint">
+// Bower
+
+bower install guff
+
+// In your SCSS file
+
+@import "guff"
+                </code>
+                <code class="prettyprint">
+// Compass
+
+gem install guff-compass
+
+// In your config.rb file
+
+require "guff-compass"
+
+// In your SCSS file
+
+@import "guff"
+                </code>
+                <a href='https://github.com/kenwheeler/guff/' class='download-button'>
+                    Download
+                    <span>Latest version from GitHub</span>
+                </a>
+            </section>
+            <section>
+                <header>
+                    <h2>Settings</h2>
+                </header>
+                <p>Override these variables at the top of your scss file.</p>
+                <code class="prettyprint">
+// Set base font size
+$rem-base: 16px !default;
+// Set line height ratio base. Accepts px, em, rem or int values
+$line-height-base: 26px !default;
+// Vertical rhythm ratio
+$type-rhythm-ratio: 1.14 !default;
+// Desktop Media Query
+$desktop: "(min-width: 1024px)" !default;
+// Tablet Media Query
+$tablet: "(min-width: 768px) and (max-width: 1023px)" !default;
+// Mobile Media Query
+$mobile: "(max-width: 767px)" !default;
+// Set Grid Column Count
+$grid-columns: 12 !default;
+// Set Grid Gutter (percentage)
+$grid-gutter: 4 !default;
+// Set Grid Padding (as px)
+$grid-padding: 20px !default;
+// Set Grid Max Width (as px)
+$grid-max-width: 1024px !default;
+                </code>
+            </section>
+            <section>
+                <header>
+                    <h2>Playground</h2>
+                </header>
+                <a href='http://codepen.io/kenwheeler/pen/tpBdF' class='download-button'>
+                    Try it out live
+                    <span>On The Codepen Sandbox</span>
+                </a>
+            </section>
+        </main>
+        <footer class="primary">
+            <p>&copy; 2014 Ken Wheeler</p>
+        </footer>
+        <script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js?lang=css"></script>
+
+    </body>
+</html>