2010-01-27 07:27:09 +00:00
|
|
|
|
---
|
2010-01-31 18:01:04 +00:00
|
|
|
|
title: Compass Documentation
|
|
|
|
|
|
crumb: Docs
|
|
|
|
|
|
body_id: home
|
2010-01-27 07:27:09 +00:00
|
|
|
|
---
|
2010-04-21 05:43:25 +00:00
|
|
|
|
%article
|
|
|
|
|
|
%h1#logo Compass
|
2010-01-21 06:25:44 +00:00
|
|
|
|
|
2010-05-10 06:17:49 +00:00
|
|
|
|
:markdown
|
2010-04-21 05:43:25 +00:00
|
|
|
|
Compass is a stylesheet authoring tool that uses the Sass stylesheet
|
|
|
|
|
|
language to make your stylesheets smaller and your web site easier to
|
|
|
|
|
|
maintain. Compass provides ports of the best of breed css frameworks
|
|
|
|
|
|
that you can use without forcing you to use their presentational class
|
|
|
|
|
|
names. It’s a new way of thinking about stylesheets that must be seen
|
|
|
|
|
|
in action!
|
2010-05-10 06:17:49 +00:00
|
|
|
|
|
2010-05-12 17:00:45 +00:00
|
|
|
|
<object width="700" height="438"><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=11671458&server=vimeo.com&show_title=1&show_byline=0&show_portrait=0&color=00ADEF&fullscreen=1" /><embed src="http://vimeo.com/moogaloop.swf?clip_id=11671458&server=vimeo.com&show_title=1&show_byline=0&show_portrait=0&color=00ADEF&fullscreen=1" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="700" height="438"></embed></object><p><a href="http://vimeo.com/11671458">An introduction to Compass</a> from <a href="http://vimeo.com/ltackett">Lorin Tackett</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
|
|
|
|
|
|
|
2010-05-10 06:17:49 +00:00
|
|
|
|
## Installing
|
|
|
|
|
|
|
|
|
|
|
|
Compass is a tool that runs on the command line.
|
|
|
|
|
|
|
|
|
|
|
|
On any system with ruby installed, open your terminal and type:
|
|
|
|
|
|
|
|
|
|
|
|
gem install compass
|
|
|
|
|
|
|
|
|
|
|
|
This will install Compass and Sass too. Verify that compass is installed:
|
|
|
|
|
|
|
|
|
|
|
|
compass version
|
|
|
|
|
|
|
|
|
|
|
|
## Creating a stand-alone project
|
|
|
|
|
|
|
|
|
|
|
|
compass create myproject
|
|
|
|
|
|
mate myproject
|
|
|
|
|
|
compass watch myproject
|
|
|
|
|
|
|
|
|
|
|
|
If you don't have TextMate, substitute the `mate myproject` part with the text
|
2010-10-30 23:52:11 +00:00
|
|
|
|
editor of your choice. Edit the `*.scss` files in the `sass` directory.
|
2010-05-10 06:17:49 +00:00
|
|
|
|
These files are yours and you can change them as you see fit, delete them,
|
|
|
|
|
|
make new ones, etc. Compass will automatically compile them into css in the
|
|
|
|
|
|
`stylesheets` directory whenever they change.
|
|
|
|
|
|
|
|
|
|
|
|
## Rails Support
|
|
|
|
|
|
|
|
|
|
|
|
compass init rails /path/to/myrailsproject
|
|
|
|
|
|
|
|
|
|
|
|
## Installing a framework
|
|
|
|
|
|
|
|
|
|
|
|
When creating a new project:
|
|
|
|
|
|
|
|
|
|
|
|
compass create myproject --using blueprint/basic
|
|
|
|
|
|
|
|
|
|
|
|
When installing into an existing project:
|
|
|
|
|
|
|
2010-05-26 15:12:54 +00:00
|
|
|
|
cd myproject
|
|
|
|
|
|
compass install blueprint/semantic
|
2010-05-10 06:17:49 +00:00
|
|
|
|
|
|
|
|
|
|
With Rails:
|
|
|
|
|
|
|
|
|
|
|
|
compass init rails /path/to/myrailsproject --using blueprint/semantic
|
|
|
|
|
|
|
|
|
|
|
|
## Bugs Reports, Discussions, Support
|
|
|
|
|
|
|
2010-04-21 05:43:25 +00:00
|
|
|
|
Send a note to the [mailing list](http://groups.google.com/group/compass-users)
|
|
|
|
|
|
and/or [File a bug](http://github.com/chriseppstein/compass/issues).
|
