Click to search on your search term.
Subscribe to Fig Leaf Tutorials


Need help with a project? Contact us at sales@figleaf.com.
From code reviews to project "jumpstarts" and full life-cycle development, we've got you covered!
Check out our case studies!
Follow us on Twitter!
Click here to join our Facebook group!

Ready to upgrade your skills? Try these instructor-led classes in Washington, DC:
Ext JS 6 Bootcamp
12/04/2017

Introducing Sass and Compass

Page of 168

Sencha uses Sass and Compass as the foundation of their theming engine for both Sencha Touch and Ext JS 4.

Sass- Syntactically Awesome Style Sheets, is a style sheet compiler that interprets the SCSS (Sassy CSS) meta language and outputs production-ready CSS. SASS extends CSS3 by adding nested rules, variables, mixins, selector inheritance, and other useful features. It's available under an MIT license from http://sass-lang.com.

Compass is an open-source CSS authoring framework, providing a design pattern for SASS, that makes your stylesheets smaller and easier to maintain. Compass Mixins (covered later in this unit) help you to normalize the inconsistencies in CSS3 support as indicated by the following example:

SCSS Generated CSS
.myCustomClass {
 @include border-radius(5px);
}
.myCustomClass{
 -webkit-border-radius:5px;
 border-radius:5px
}

 

Page of 168
comments powered by Disqus