compass-stitch 0.0.1

data/stylesheets/stitch/patterns/images/_image-replace.scss

@@ -0,0 +1,17 @@
+/*
+  Removes any text from an element and replaces it with an image
+*/
+.f-ir {
+	display             : block;
+	text-indent         : -9999em;
+	overflow            : hidden;
+  	background-repeat   : no-repeat; 
+	text-align          : left; 
+	direction           : ltr;
+}
+
+@mixin image-replace($img) {
+	@extend .f-ir;
+	height:image_height($img);
+	width:image_width($img);
+}

data/stylesheets/stitch/patterns/layout/_center.scss

@@ -0,0 +1,5 @@
+@mixin center-horizontal($width, $margin-top:0, $margin-bottom:0) {
+	margin:$margin-top auto $margin-bottom auto;
+	width:$width;
+	float:none;
+}

data/stylesheets/stitch/patterns/layout/_clear-floats.scss

@@ -0,0 +1,27 @@
+/* Allows a parent element to enclose the full height of the children
+ * elements when all of the children are floated.
+ * Normally the parent will have no height. 
+ * @see http://nicolasgallagher.com/micro-clearfix-hack/
+ */
+
+@mixin clear-floats($legacy:false) {
+	// IE6/7 support
+	@if $legacy == true {
+		&::before,
+		&::after {
+			content:"";
+			display:block;
+		}
+		&::after {
+			clear:both;
+		}
+		zoom:1;
+	}
+	@if $legacy == false {
+		&::after {
+			content:"";
+			display:block;
+			clear:both;
+		}
+	}
+}

data/stylesheets/stitch/patterns/layout/_force-scrollbars.scss

@@ -0,0 +1,3 @@
+@mixin force-scrollbars {
+	height:101%;
+}

data/stylesheets/stitch/patterns/layout/_media.scss

@@ -0,0 +1,24 @@
+/*
+  For blocks of content with media beside them.
+  Adding overflow hidden changes the way the content interacts with the float
+*/
+
+/*
+	Apply it to the wrapper div
+	<div>
+		<img class="content-image" />
+		<div class="content"></div>
+	</div>
+*/
+/*
+@mixin content-with-media($position: left, $spacing:20px, $image: .content-image, $content: .content) {
+ 	#{$image} {
+		float:$position;
+		margin-#{opposite-position($position)}:$spacing;
+	}
+	#{$content} {
+		overflow:hidden;
+		float:none;
+	}
+}
+*/

data/stylesheets/stitch/patterns/legacy/_has-layout.scss

@@ -0,0 +1,6 @@
+/*
+  Triggers hasLayout for IE7 and below. Fixes most IE issues
+*/
+@mixin has-layout {
+	zoom:1;
+}

data/stylesheets/stitch/patterns/legacy/_inline-block.scss

@@ -0,0 +1,15 @@
+/*
+  Cross-browser inline-block.
+*/
+@mixin inline-block {
+	& {
+		*display : inline;
+	}
+	display         : -moz-inline-box;
+	-moz-box-orient : vertical;
+	display         : inline-block;
+	vertical-align  : middle;
+	& {
+		*vertical-align : auto; 
+	}
+}

data/stylesheets/stitch/patterns/mobile/_fixed-text.scss

@@ -0,0 +1,7 @@
+/*
+  Prevents the resizing of text. Useful for mobile web apps
+*/
+@mixin fixed-sized-text {
+	-webkit-text-size-adjust:none;
+	-ms-text-size-adjust:none;
+}

data/stylesheets/stitch/patterns/print/_append-content.scss

@@ -0,0 +1,13 @@
+/*
+  Adds URLs and abbreviations to the end of links in printed documents
+*/
+
+@mixin append-content {
+	a:after {
+		content:" (" attr(href) ")";
+	}
+	abbr:after {
+		content: " (" attr(title) ")";
+	}
+}
+

data/stylesheets/stitch/patterns/print/_text.scss

@@ -0,0 +1,36 @@
+/*
+  Sets up some sensible text defaults for printed pages
+*/
+
+@mixin printable-text {
+	background:transparent !important; 
+	color:#444 !important; 
+	text-shadow:none !important;
+	
+	pre, 
+	blockquote { 
+		page-break-inside: avoid;
+	}
+
+	img {
+		page-break-inside:avoid;
+	}
+
+	p, 
+	h2, 
+	h3 {
+		orphans:3;
+		widows:3;
+	}
+
+	h2, 
+	h3 {
+		page-break-after:avoid;
+	}
+	
+	a, 
+	a:visited {
+		color: #444 !important; 
+		text-decoration: underline; 
+	}
+}

data/stylesheets/stitch/patterns/text/_text-rendering.scss

@@ -0,0 +1,9 @@
+/*
+  Nicer text rendering in webkit and gecko
+  @see http://www.aestheticallyloyal.com/public/optimize-legibility/
+  @see http://files.christophzillgens.com/webkit-font-smoothing.html
+*/
+@mixin improve-text-rendering {
+	text-rendering:optimizeLegibility;
+	-webkit-font-smoothing:subpixel-antialiased;
+}

data/stylesheets/stitch/reset/README.md

@@ -0,0 +1,9 @@
+# Reset
+
+The reset include with this framework is a little bit different from normal reset files. 
+
+* It doesn't include obscure elements that people don't often use
+* It resets all form styles
+* It resets all text to be the same as the body, including links
+* Lists, code and links (in fact, all text) are reset to look the same
+* Fixes the box-sizing inconsistencies between browsers. This is the cause of most cross-browser issues with form styles

data/stylesheets/stitch/reset/_desktop.scss

@@ -0,0 +1,243 @@
+/* Block Elements
+---------------------------------------- */
+/*
+  Reset all COMMON block elements.
+  If you're using uncommon or invalid elements you will need to reset them yourself
+*/
+address, 
+article, 
+aside, 
+audio,
+blockquote, 
+body,
+button,
+dd, 
+details,
+div, 
+dl,
+dt,
+fieldset, 
+figcaption, 
+figure, 
+footer, 
+form, 
+h1, 
+h2, 
+h3, 
+h4, 
+h5, 
+h6, 
+header, 
+hgroup, 
+hr,
+input,
+label,
+legend,
+li,
+nav, 
+ol, 
+p, 
+pre, 
+section,
+select,
+table,
+textarea,
+th,
+td,
+ul,
+video
+{
+	margin     : 0;
+	padding    : 0;
+	border     : 0;
+	background : none;
+}
+
+/* Forms
+---------------------------------------- */
+input,
+label,
+select,
+button,
+textarea {
+	display        : inline-block;
+	vertical-align : middle;
+	white-space    : normal;
+}
+
+/* Hand cursor on clickable input elements */
+label,
+input[type=button],
+input[type=submit],
+button {
+  cursor: pointer; 
+}
+
+/* 
+	Form elements have different box-sizing models by default.
+	This will fix form styling woes across webkit, gecko and trident
+*/
+input,
+textarea {
+	-webkit-box-sizing : content-box;
+	-moz-box-sizing    : content-box;
+	box-sizing         : content-box;
+}
+
+button,
+input[type=reset],
+input[type=button],
+input[type=submit],
+input[type=checkbox],
+input[type=radio],
+select {
+	-webkit-box-sizing : border-box;
+	-moz-box-sizing    : border-box;
+	box-sizing         : border-box;
+}
+
+/* Standardize radio and checkbox sizes */
+input[type=checkbox],
+input[type=radio] {
+  width  : 13px;
+  height : 13px; 
+}
+
+/* 
+	Make buttons play nice in IE:
+	@see www.viget.com/inspire/styling-the-button-element-in-internet-explorer/ 
+*/
+button,
+input[type="reset"],
+input[type="button"],
+input[type="submit"] {
+  overflow : visible;
+  width    : auto; 
+}
+
+/* Turn off scroll bars in IE unless needed */
+textarea {
+  overflow : auto; 
+}
+
+/* HTML5 elements
+---------------------------------------- */
+/*
+  So that browsers render the new elements correctly. Only block elements need to be worried about as browsers render unknown elements as inline by default.
+*/
+article, aside, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section {
+	display:block
+}
+
+/* Text Elements
+---------------------------------------- */
+/*
+  Reset all COMMON text elements.
+  If you're using uncommon or invalid elements you have to reset them yourself
+*/
+a, 
+abbr, 
+b, 
+body,
+br, 
+cite, 
+code, 
+dfn, 
+em, 
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+img, 
+input, 
+kbd,
+label,
+mark, 
+pre,
+q, 
+samp, 
+select, 
+small, 
+span, 
+strong, 
+sub, 
+sup, 
+textarea, 
+var
+{
+  font-size       : 100%;
+  font-family     : sans-serif;
+  font-style      : normal;
+  font-weight     : normal;
+  font-variant    : normal;
+  color           : #000;
+  vertical-align  : baseline;
+  text-decoration : none;
+}
+
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+  content: "";
+  content: none; 
+}
+
+/*
+  Make lists display inline and not like list items
+  You must explicitly declare lists in copy to look the way they do
+  It will save you a whole lot of code
+*/
+li {
+  list-style: none;
+  display: block; 
+}
+
+/*
+  Make links look like normal text. This way you don't need to
+  override styles when you create buttons and wrap blocks in links
+*/
+a {
+  &:hover,
+  &:active {
+    outline: none; 
+  } 
+}
+
+/* Set sub, sup without affecting line-height: gist.github.com/413930 */
+sub,sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative; 
+}
+
+sup {
+  top: -0.5em; 
+}
+
+sub {
+  bottom: -0.25em; 
+}
+
+/* Tables
+---------------------------------------- */
+table {
+  border-collapse: collapse;
+  border-spacing: 0; 
+}
+
+/* Media
+---------------------------------------- */
+/* Nicer image sizing in IE */
+img {
+	-ms-interpolation-mode: bicubic
+}
+	
+/* fluid images and objects */
+img,object,embed,video {
+	max-width:100%;
+	display:block;
+}

data/templates/project/manifest.rb

@@ -0,0 +1,18 @@
+discover :all
+description "Stitch CSS directory template"
+
+help %Q{
+  Read the Stitch documentation for more details:
+     https://github.com/anthonyshort/stitch-css/blob/master/README.md
+}
+
+welcome_message %Q{
+  The Stitch project directory has been created.
+  
+  Usage:
+    For browsers that support media queries, link to the master.css file in the root. For other browsers, link to the legacy.css file in the root. 
+    
+    The common layouts (desktop, print and mobile) have been created for you with the common patterns already imported.
+    
+    Read the documentation for more information about structuring your CSS. 
+}