Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Responsive Web Design with Sass and Compass training workshop files

branch: master

Fetching latest commit…

Octocat-spinner-32-eaf2f5

Cannot retrieve the latest commit at this time

Octocat-spinner-32 css
Octocat-spinner-32 js
Octocat-spinner-32 sass
Octocat-spinner-32 .gitignore
Octocat-spinner-32 README.md
Octocat-spinner-32 config.rb
Octocat-spinner-32 index.html
README.md

RWD with Sass+Compass Mini-training

Responsive Web Design with Sass and Compass training workshop files

Getting started

You'll need to install a few Ruby gems to take advantage of Sass and Compass on your local development machine.

Mac

OSX comes with Ruby installed.

Windows

Windows users should download and install RubyInstaller for Windows.

Linux

Linux users, you probably know how to get Ruby on your machine. Do that. Or follow the instructions in the PDF if you're not sure.

Getting Help

If you have any questions regarding installing, they are most likely answered within the Installing Sass+Compass Guide

Gem installation

Commands that start with # are just comments

# Update ruby, sass, compass and all existing gems
sudo gem update --system

# Download and install some Compass gems
sudo gem install compass toolkit compass-normalize sassy-buttons singularitygs

Documentation for these Compass extensions

Using JavaScript to get window dimensions

In the cosole of your developer tools of choice type the following line of code. Whenever you resize the window its width will be printed in the console.

window.onresize = function(){console.log(window.innerWidth);}

Using MQtest.io to get window dimensions

http://mqtest.io will show you window, device, orientation, aspect-ratio, and UA.

Something went wrong with that request. Please try again.