![]() Pretty Cool huh?Īlthough this is only a glimpse into Compass, I hope it’s enough to spark your interest to investigate this helpful tool even further. We also have no need to return to our style sheets in order to repair vendor prefixes and even differing syntaxes. Notice that we now have no need to write vendor prefixes because Compass is going to take care of that for us “auto–magically.” The neat thing about this approach –compared to the diy method– is that our style sheets are nice and neat once again. ![]() } Compass removing our vendor prefix bloat The power that we now have with both Sass and Compass is tremendously powerful allowing us to do amazing things with our style sheets like so. In order use Compass in our work we have to reference Compass plugins using statements from our style sheets. # sass-convert -R -from scss -to sass css/sass scss & rm -rf sass & mv scss sass Compass Config File Powering Up Compass # If you prefer the indented syntax, you might want Require "/Library/Ruby/Gems/1.8/gems/compass-0.12.1/lib/compass.rb" # Require any additional compass plugins here. If you use third–party Compass plugins, any require statements must contain a full, absolute path to the plugin’s required file (usually a gem or. You install Compass extensions by adding a load/require statement to the beginning of your project’s config.rb file. # sass-convert -R -from scss -to sass css/sass scss & rm -rf sass & mv scss sass Compass config.rb File Compass Frameworks & Extensions # To enable relative paths to assets via compass # Set this to the root of your project when deployed: (This is because Compass *is* a framework manager, so you use it instead.) Likewise, for Compass projects you must control all settings for Sass files by editing your Compass config.rb file rather than using the Inspector in CodeKit.Ĭonfiguring Compass # Require any additional compass plugins here. When you use Compass on a project, you may not use CodeKit’s “frameworks” feature for Sass files. If there isn’t a config.rb present we must tell Codekit to make a new one Once you’ve told Codekit to use this project with Compass, Codekit will need to locate the compass config.rb file. ![]() You can also create a completely new Compass project by using the command in the File menu or by clicking the gear icon in the lower left corner of the Codekit window. Note: your Compass project must have a configuration file in order to work with CodeKit. ![]() Drag your project folder into the left side of Codekit and right click with your mouse…Įnable Compass by right–clicking on the project and choosing “Compass” → “Use Compass on this project” In order to use Compass and Codekit together we need to make Codekit aware that’s exactly what we wanna do. That’s it! Compass is now installed and we’re ready to Rock N’ Roll. Step numero uno is to open up your Terminal –or whatever you use to type command lines with– and enter the following Install Compass $ gem install compass Verify Compass is installed $ compass version Let’s start at the beginning and assume you already have Sass installed along with Codekit. ![]() Codekit will automatically detect Compass projects if a compass configuration file is included within the project’s root folder. I, however will be using the amazing and wonderful Codekit for the rest of my discussion. Compass and Sass work together, but if command line watching isn’t your thing then there’s a Compass GUI for that. Not ‘SASS’) then you’re aware of the installation process and the need to watch files in order to preprocess. If you’re a user of Sass (yes, capital ‘S’ and the rest is lowercase.
0 Comments
Leave a Reply. |
Details
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |