206 lines
4.8 KiB
Plaintext
206 lines
4.8 KiB
Plaintext
|
---
|
|||
|
title: Plugins and frameworks
|
|||
|
crumb: Plugins and frameworks
|
|||
|
---
|
|||
|
|
|||
|
%h3
|
|||
|
Adding Frameworks to Compass
|
|||
|
|
|||
|
%ul
|
|||
|
%li
|
|||
|
Add a folder under
|
|||
|
%code
|
|||
|
compass/frameworks
|
|||
|
%li
|
|||
|
Register it by creating a file in
|
|||
|
%code
|
|||
|
compass/lib/compass/frameworks/
|
|||
|
%li
|
|||
|
Require it in
|
|||
|
%code
|
|||
|
compass/lib/compass/frameworks.rb
|
|||
|
\.
|
|||
|
|
|||
|
%h3
|
|||
|
Supported Frameworks
|
|||
|
|
|||
|
%table.datagrid
|
|||
|
%tr
|
|||
|
%th Framework
|
|||
|
%th Version
|
|||
|
%th Status
|
|||
|
%th Homepage
|
|||
|
%th Documentation
|
|||
|
%tr
|
|||
|
%td Compass Core
|
|||
|
%td 0.10
|
|||
|
%td pre5
|
|||
|
%td
|
|||
|
%a
|
|||
|
http://compass-style.org
|
|||
|
%td
|
|||
|
You are currently vising the Compass docs.
|
|||
|
%tr
|
|||
|
%td Blueprint
|
|||
|
%td 0.8.0
|
|||
|
%td Stable
|
|||
|
%td
|
|||
|
%a
|
|||
|
http://blueprintcss.org/
|
|||
|
%td
|
|||
|
%a{:href => "/docs/reference/blueprint/"}
|
|||
|
Blueprint docs
|
|||
|
%tr
|
|||
|
%td YUI
|
|||
|
%td 2.5.2
|
|||
|
%td Beta
|
|||
|
%td
|
|||
|
%a
|
|||
|
http://developer.yahoo.com/yui/grids/
|
|||
|
%td
|
|||
|
%a{:href => "/docs/reference/yui/"}
|
|||
|
YUI docs
|
|||
|
%tr
|
|||
|
%td 960
|
|||
|
%td 1.0
|
|||
|
%td Stable
|
|||
|
%td
|
|||
|
%a
|
|||
|
http://960.gs/
|
|||
|
%td
|
|||
|
%a{:href => "http://github.com/chriseppstein/compass-960-plugin"}
|
|||
|
Compass960 plugin on Github
|
|||
|
|
|||
|
%h3
|
|||
|
Compass plugins
|
|||
|
|
|||
|
%p
|
|||
|
Compass allows you to easily download, install, and upgrade plugins that share design and design elements between users and projects.
|
|||
|
|
|||
|
%p
|
|||
|
For instructions on how to install a plugin, please refer to the individual plugin's instructions.
|
|||
|
|
|||
|
%h3 Released Plugins
|
|||
|
|
|||
|
%h4 Frameworks
|
|||
|
|
|||
|
%ul
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/chriseppstein/compass-960-plugin" }
|
|||
|
960.gs
|
|||
|
– a lightweight CSS framework for producing fixed-width grid-based layouts
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/adamstac/grid-coordinates" }
|
|||
|
Grid Coordinates
|
|||
|
– a lightweight CSS framework for producing fixed-width grid-based layouts, based on
|
|||
|
%a{ :href => "http://1kbgrid.com/" }
|
|||
|
1KB CSS Grid
|
|||
|
(which was loosely based on 960.gs). Supports nested grids.
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/alexcabrera/graphpaper" }
|
|||
|
GraphPaper
|
|||
|
– a lightweight CSS framework for producing fixed-width grid-based layouts
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/tdreyno/compass-baseline" }
|
|||
|
Baseline
|
|||
|
– a CSS framework for producing grid-based layouts (up to 8 columns) with typography. See
|
|||
|
%a{ :href => "http://baselinecss.com/" }
|
|||
|
http://baselinecss.com/
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/bangpound/compass-drupal-zen-plugin" }
|
|||
|
Drupal Zen
|
|||
|
– adds the Drupal Zen theme STARTERKIT to Compass
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/ericam/compass-susy-plugin" }
|
|||
|
Susy
|
|||
|
– a semantic CSS framework creator. Susy is an expert at fluid grids in an elastic (or fluid, or fixed) shell that will never activate the horizontal scroll bar.
|
|||
|
|
|||
|
%h3
|
|||
|
Colors
|
|||
|
%ul
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/chriseppstein/compass-colors" }
|
|||
|
Compass Colors
|
|||
|
– for working with colors in Sass, and generating color themes
|
|||
|
|
|||
|
%h3
|
|||
|
Widgets
|
|||
|
%ul
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/imathis/fancy-buttons" }
|
|||
|
Fancy Buttons
|
|||
|
–
|
|||
|
%a{ :href => "http://sass-lang.com/tutorial.html#mixins" }
|
|||
|
mixins
|
|||
|
to get beautiful buttons with
|
|||
|
%span.caps
|
|||
|
CSS
|
|||
|
gradients that degrade nicely. Uses Compass Colors.
|
|||
|
|
|||
|
%h3
|
|||
|
Misc
|
|||
|
%ul
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/tdreyno/compass-slickmap" }
|
|||
|
Slickmap
|
|||
|
– plugin for
|
|||
|
%a{ :href => "http://astuteo.com/slickmap/" }
|
|||
|
slickmap
|
|||
|
sitemaps
|
|||
|
|
|||
|
%h3
|
|||
|
Sass Libraries
|
|||
|
%p
|
|||
|
Libraries are simply Sass stylesheets or
|
|||
|
%a{ :href => "http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#partials" }
|
|||
|
partials
|
|||
|
\.
|
|||
|
%ul
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/handcrafted/handcrafted-compass-mixins/blob/master/_border-radius.sass" }
|
|||
|
Handcrafted Rounded Corners
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/ntreadway/JQuery.tools.tabs.sass" }
|
|||
|
Ntreadway JQuery tools tabs
|
|||
|
%h3
|
|||
|
Plugins that are Works-In-Progress
|
|||
|
%ul
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/hpoydar/compass-aristo-plugin" }
|
|||
|
Aristo
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/marnen/compass-elastic-plugin" }
|
|||
|
Elastic
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/jtoy/compass-fluid960-plugin" }
|
|||
|
Fluid 960
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/kosmas58/compass-jquery-plugin" }
|
|||
|
jQuery
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/djmaze/compass-yaml-plugin" }
|
|||
|
%span.caps
|
|||
|
YAML
|
|||
|
|
|||
|
%h3
|
|||
|
Other Sass-based Projects
|
|||
|
%ul
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/jazen/css" }
|
|||
|
Jazen’s
|
|||
|
%span.caps
|
|||
|
CSS
|
|||
|
Framework
|
|||
|
– Sass library that
|
|||
|
%em
|
|||
|
should
|
|||
|
be a compass plugin.
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/teejayvanslyke/sassafras" }
|
|||
|
Sassafras
|
|||
|
– Color Scheme Generator for Sass
|
|||
|
%li
|
|||
|
%a{ :href => "http://github.com/danboy/tenplate" }
|
|||
|
Tenplate
|
|||
|
– Another Sass library with rails helpers.
|