Generated by SassMeister.com.

SassMeister-input.scss

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

// Returns $list as a string
// -------------------------------------------------------------------------------
// @documentation http://sassylists.com/documentation/#debug
// -------------------------------------------------------------------------------
// @example debug(a b c d e)   => [ a, b, c, d, e ]
// @example debug(a b (c d e)) => [ a, b, [ c, d, e ] ]
// -------------------------------------------------------------------------------
// @param $list [List] : list
// @param $pre [Boolean] : enable/disable variables type and proper indentation
// @param $level [Number] : internal variable for recursivity
// -------------------------------------------------------------------------------
// @return [String]
 
@function debug($list, $pre: false, $level: 1) {
    $tab: "    ";
    $indent: "";
    $break: if($pre, "\A ", "");
  
    @if length($list) == 0 {
        @return "( )";
    }
  
    @if length($list) == 1 {
        @return if($pre,  "(" + type-of($list) + ") ", "") + $list;
    }
 
    @for $i from 1 to $level {
        $indent: $indent + $tab;
    }
 
    $result: "[" + $break;
 
    @for $i from 1 through length($list) {
        $item: nth($list, $i);
        $result: $result + if($pre, $indent + $tab, " ");
 
        @if length($item) > 1 {
            $result: $result 
                + if($pre, "(list: " + length($item) + ") ", "") 
                + debug($item, $pre, $level + 1);
        }
 
        @else {
            @if $pre {
                $result: $result + "(" + type-of($item) + ") ";
            }
      
            @if length($item) == 0 {
                $result: $result + "( )";
            }
      
            @else if type-of($item) == string {
                $result: $result + quote($item);
            }
      
            @else if $item == null {
                $result: $result + "null";
            }
      
            @else {
                $result: $result + $item;
            }
        }
    
        @if $i != length($list) {
            $result: $result + "," + $break;
        }
    }
 
    $result: $result + $break + if($pre, if($level > 1, $indent, ""), " ") + "]";
 
    @return quote($result);
}
 
// Mixin displaying clean debug
// -------------------------------------------------------------------------------
// @param $list [List] : list
 
@mixin debug($list, $whitescreen: false) {
    body {
        &:before {
            content: debug($list, true)              !important;

            display: block                            !important;
            margin: 1em                               !important;
            padding: .5em                             !important; 

            background: #EFEFEF                       !important;
            border: 1px solid #DDD                    !important;
            border-radius: .2em                       !important;

            color: #333                               !important;
            font: .75em/1.5 "Courier New", monospace  !important;
            text-shadow: 0 1px white                  !important;
            white-space: pre-wrap                     !important;
        }
        &:after {
            display: block;
            content: debug($list);
        }
        @if ($whitescreen) {
            * {
                display: none;
            }
        }
    }
}
 
/**
 * Here is a cute list
 */
$list: (a #BADA55 42, (false (yummy cupcake)), 14px, "gloubiboulga", (), null);
 
/**
 * Awesome debug mixin is awesome
 */
@include debug($list);

SassMeister-output.css

/**
 * Here is a cute list
 */
/**
 * Awesome debug mixin is awesome
 */
body:before {
  content: "[\a     (list: 3) [\a         (string) a,\a         (color) #BADA55,\a         (number) 42\a     ],\a     (list: 2) [\a         (bool) false,\a         (list: 2) [\a             (string) yummy,\a             (string) cupcake\a         ]\a     ],\a     (number) 14px,\a     (string) gloubiboulga,\a     (list) ( ),\a     (null) null\a]" !important;
  display: block                            !important;
  margin: 1em                               !important;
  padding: .5em                             !important;
  background: #EFEFEF                       !important;
  border: 1px solid #DDD                    !important;
  border-radius: .2em                       !important;
  color: #333                               !important;
  font: .75em/1.5 "Courier New", monospace  !important;
  text-shadow: 0 1px white                  !important;
  white-space: pre-wrap                     !important;
}
body:after {
  display: block;
  content: "[ [ a, #BADA55, 42 ], [ false, [ yummy, cupcake ] ], 14px, gloubiboulga, ( ), null ]";
}