scottkellum

// ----
// Sass (v3.3.0.rc.2)
// Compass (v1.0.0.alpha.17)
// ----

@media screen and (min-width: 600px) and (max-width: 1000px) {
  div {
    foo: bar;
  }
}

scottkellum

# COMPASS CONFIG

http_path = "test/"
css_dir = "test/css"
sass_dir = "test/stylesheets"
images_dir = "test/images"

scottkellum

// ----
// Sass (v3.3.0.rc.2)
// Compass (v1.0.0.alpha.17)
// ----

// Using Sass 3.3 maps as a way to change
// the output of mixins.

scottkellum

// ----
// Sass (v3.3.0.rc.2)
// Compass (v1.0.0.alpha.17)
// Susy (v2.0.0.beta.2)
// ----

@import "susy";

.class{
  // foo: bar;

scottkellum

// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----

test {
  add-unit: 12px + 20;
  multiply: 12px * 2;
  negitive: 12px * -1;
  // duplicate-value: 12px * 12px; // < this will result in an error

scottkellum

// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----

@import "compass";

$map: (
  animation: foo 1s infinite,
  width: 200px,

scottkellum

// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----

@import "modular-scale";

$base-font-size: 16px;

@function msem($val) {

scottkellum

// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----

@if myfunc(0) != unquote("myfunc(0)") {
  myfunc {
    exists: true;
  }
} @else {

scottkellum

// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----

$mymixin: (
  styles: (
    border-radius: 1em,
    background-color: red,
  ),

scottkellum

// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----

@function baseten-hex($number) {
  $hex-values: 0 1 2 3 4 5 6 7 8 9 a b c d e f;
  @if round($number) != $number {
    @warn "base10-hex() needs a integer";
  }