69 lines
2.0 KiB
Plaintext
69 lines
2.0 KiB
Plaintext
|
%h1= item[:title]
|
|||
|
|
|
|||
|
|
%h2#semantic-blueprint Semantic Blueprint Template
|
|||
|
|
|
|||
|
|
%p
|
|||
|
|
The semantic template assumes that you will write your own selectors
|
|||
|
|
and apply the blueprint mixins to them to achieve a design that does
|
|||
|
|
not use any presentational classes. This is the preferred approach for
|
|||
|
|
using Blueprint with compass, but if you want a more traditional
|
|||
|
|
approach, consider the <a href="#basic-blueprint">Basic
|
|||
|
|
Blueprint Template</a>.
|
|||
|
|
|
|||
|
|
%h2 Getting Started with Semantic Blueprint
|
|||
|
|
|
|||
|
|
%p
|
|||
|
|
Once you get Compass installed, you are ready to create a new
|
|||
|
|
blueprint project. In your terminal enter the following commands:
|
|||
|
|
|
|||
|
|
%code.shell
|
|||
|
|
%pre
|
|||
|
|
%span.prompt<> $
|
|||
|
|
compass create my_project --using blueprint/semantic
|
|||
|
|
%br>
|
|||
|
|
%span.prompt<> $
|
|||
|
|
cd my_project
|
|||
|
|
|
|||
|
|
%hr
|
|||
|
|
|
|||
|
|
%h2#basic-blueprint Basic Blueprint Template
|
|||
|
|
|
|||
|
|
%p
|
|||
|
|
The basic template is the starting point for working with blueprint
|
|||
|
|
in compass. It can be used to generate CSS that is virtually identical
|
|||
|
|
to the Blueprint CSS. If all you want is an easy way to customize the
|
|||
|
|
grid or typography, you’ll be using these libraries. Since the basic
|
|||
|
|
library is built on top of the blueprint modules, customization will
|
|||
|
|
require that you refer to the particular module you want to customize.
|
|||
|
|
|
|||
|
|
%p
|
|||
|
|
If you want to get started with the Basic Template because it feels
|
|||
|
|
more familiar to you, that's fine. It's very easy to transition to
|
|||
|
|
<a href="#semantic-blueprint">semantic selectors</a> when you're ready.
|
|||
|
|
|
|||
|
|
|
|||
|
|
%h2 Getting Started with Basic Blueprint
|
|||
|
|
|
|||
|
|
%p
|
|||
|
|
Once you get Compass installed, you are ready to create a new
|
|||
|
|
blueprint project. In your terminal enter the following commands:
|
|||
|
|
|
|||
|
|
%code.shell
|
|||
|
|
%pre
|
|||
|
|
%span.prompt<> $
|
|||
|
|
compass create my_project --using blueprint/basic
|
|||
|
|
|
|||
|
|
%h2 Blueprint Plugins
|
|||
|
|
|
|||
|
|
%p
|
|||
|
|
The core blueprint plugins are available, but must be installed
|
|||
|
|
into your project. Follow the instructions below:
|
|||
|
|
|
|||
|
|
%ul
|
|||
|
|
%li
|
|||
|
|
%a(href="#") Blueprint Buttons
|
|||
|
|
%li
|
|||
|
|
%a(href="#") Blueprint Link Icons
|
|||
|
|
|
|||
|
|
|