https://github.com/anthonyshort/stitch-css

CSS patterns for Compass
https://github.com/anthonyshort/stitch-css

Last synced: 9 days ago
JSON representation

CSS patterns for Compass

• Host: GitHub
• URL: https://github.com/anthonyshort/stitch-css
• Owner: anthonyshort
• Created: 2011-04-06T03:10:00.000Z (over 13 years ago)
• Default Branch: master
• Last Pushed: 2012-10-28T06:01:34.000Z (about 12 years ago)
• Last Synced: 2024-10-16T05:25:19.697Z (23 days ago)
• Language: Ruby
• Homepage: http://anthonyshort.github.com/stitch-css/
• Size: 679 KB
• Stars: 260
• Watchers: 10
• Forks: 19
• Open Issues: 4
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Stitch - CSS Pattern Framework for Compass

Patterns are chunks of styles that we use on every project. These chunks of styles generally perform a particular function, such as clearing floats. Having to write these styles each time is annoying and the function of these chunks of code in our stylesheets is obscure. 

By breaking these patterns into reusable classes and mixins we can:

* Make our stylesheets free from clutter

* Give our styles more meaning

* Reduce the size of our stylesheet

* Only have to write them once

* Are updatable when newer methods are discovered by updating the framework

## As Compass Extension

	sudo gem install stitch

	

Add it to your Compass config.rb

	require 'stitch'

Import it into your Sass

	@import 'stitch';

Or import it in parts

	@import 'stitch/reset';

	@import 'stitch/patterns';

## With Bower

```

bower install stitch-css

```

Then include it into your projects:

```scss

@import 'components/stitch-css/stylesheets/stitch';

```

## Patterns

[See all of the patterns available](https://github.com/anthonyshort/stitch-css/tree/master/stylesheets/stitch/patterns)

By using @import 'stitch/patterns'; you will have access to all of the pattern mixins. The patterns are all mixins with a couple of extra classes used for extending.

## Reset

Stitch includes a unique CSS reset. It resets everything back to it's raw text form so that it's easy to build from.

To manually import the Stitch reset.

	@import 'stitch/reset';