micahgodbolt

<div></div>

micahgodbolt

<div></div>

micahgodbolt

/* Welcome to Compass.
 * In this file you should write your main styles. (or centralize your imports)
 * Import this file using the following HTML or equivalent:
 * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */

@import "susy";

@mixin span(
  $span
) {

micahgodbolt

<div class="extends">
  <div><span></span></div>
  <div><span></span></div>
  <div><span></span></div>
  <div><span></span></div>
  <div><span></span></div>
  <div><span></span></div>
  <div><span></span></div>
  <div><span></span></div>
  <div><span></span></div>

micahgodbolt

<div></div>

micahgodbolt

<div class="styleguide">
  <div class="colors">
    <div>Colors</div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>

micahgodbolt

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

nav{
  ul {
    li {
      $new-selector: append(nth(&, 1), ".abc"); // replace ".abc" with a and it works
      @at-root #{$new-selector} {

micahgodbolt

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

@mixin insert-context($target, $context, $order: before) {
    $new-context: "";
    @if $order == before {
      $new-context: selector-nest($context, $target);  
    }

micahgodbolt

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

@mixin insert-context($target, $context, $order: before) {
    $new-context: "";
    @if $order == before {
      $new-context: selector-nest($context, $target);  
    }

micahgodbolt

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

@mixin insert-context($target, $context, $order: before) {
    $new-context: "";
    @if $order == before {
      $new-context: selector-nest($context, $target);  
    }