1. By: Gerald Fry
introducingCompass

2. What is Compass? Open-source CSS Authoring Framework
Built for use with SASS
Ruby Gem
Features:
CSS3 Mixins
Automatic Sprite Creation
Comes with a CSS Reset to import
Sticky Footer
More advanced features
Work Smart and Efficiently

3. CSS3 Mixins – Box-Shadow
First import the compass CSS3 mixin file to have access to all CSS3 mixins
Use the + symbol to use a mixin then provide the name
CSS output

4. Automatic Image Spriting
Imagine you have 4 icons you want to sprite
The simplest way to use these icon sprites is to let compass give you a class for each sprite:
Import the library
Import the images
Include the created sprite classes

5. Automatic Image Spriting
When the file is saved, you will get the following CSS output:

6. CSS3 Reset Based on Eric Meyer’s reset 2.0
Simply import the reset utility file

7. Sticky Footer
This module provides tools needed to lay out your footer such that it sticks to the bottom of the page.
Example

8. Compass Typography module
The Compass Typography module provides some basic mixins for common text styling patterns.
Imports
Links – Tools for styling anchor links
Lists – Tools for styling lists
Text – Style helpers for your text
Vertical Rhythm – Create and maintain a vertical rhythm for your type.

9. Extra Utilities and Software
CodeKit for MAC – Compiling software that refreshes the browser upon compile.
Prepros for Windows – Same as CodeKit.
Getting Started with Sass and Compass. with-sass-and-compass

10. So, why should I use Compass?
Comes packed with CSS3 mixins that allow you to quickly create those vendor prefixes with one line.
Spriting is easy and powerful for large projects
Work smarter not harder
Community driven

11. Any Questions?

12. Resources http://sass-lang.com/guide http://compass-style.org/
sass-mixin-wizardry

13. Q1: When should I use compass? What language does Compass extend?
Exam Questions
Q1: When should I use compass? What language does Compass extend?
Developers should use compass on large team projects to save time when doing css markup. Compass extends the SASS framework and is a Ruby gem.
Q2: What are the main functions that compass provides?
Compass provides various CSS3 mixins as well as helper classes to quickly create styles. It allows the developer to keep consistent and easy to change styles.

14. Q3: What is a CSS Authoring Framework? Name 3 of them.
Exam Questions
Q3: What is a CSS Authoring Framework? Name 3 of them.
CSS Authoring Frameworks are languages that allow developers to organize, repeat, and create code using variables, mixins, functions, and other functions provided by the framework. SASS, LESS, and Compass are all examples of CSS Authoring Frameworks.