roytomeij

// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----

@mixin border-radius($radius, $vertical-radius) {
  border-radius: #{$radius} / #{$vertical-radius};
}

.foo {

roytomeij

// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----

$random-string: unique-id();

.foo {
  content: "random string: #{$random-string}";
}

roytomeij

- 60.times do |i|
  %div{:class => "item_#{i}"}

roytomeij

// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----

@mixin animation-keyframes {
  $animation-name: unique-id();
  animation-name: $animation-name;

  @keyframes #{$animation-name} {

roytomeij

// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----

$custom_series: ();

@for $i from 0 through 9 {
  $val: (
    class: series_#{$i},

roytomeij

// ----
// Sass (v3.4.9)
// Compass (v1.0.1)
// ----

.button {
  color: red;
  background: green;

  &.gray {

roytomeij

// ----
// Sass (v3.4.5)
// Compass (v1.0.1)
// ----

$table-columns: (
  two-fixed-one-fluid: 100px 100px x,
  two-relative-one-fluid-one-fixed: 10% 10% x 50px
);

roytomeij

// ----
// Sass (v3.4.0.rc.3)
// Compass (v1.0.0.rc.1)
// ----

//this works, but writing out the full parent modifier name is a drag and error-prone when changing the component name
.test {
  
  &__child {
    display: inline-block;

roytomeij

// ----
// Sass (v3.3.14)
// Compass (v1.0.0.rc.0)
// ----

@mixin foo {
  $var: baz !global;
}

@mixin bar {

roytomeij

// ----
// Sass (v3.3.10)
// Compass (v1.0.0.alpha.20)
// ----

$mqs: (
    '500px': ('font-size': 12px, 'color': #000),
    '1000px': ('font-size': 18px, 'color': #ccc),
  );