sass/ezy/grid/_debug.scss in ezy-0.3.2 vs sass/ezy/grid/_debug.scss in ezy-0.3.3

@@ -1,22 +1,52 @@
 // ---------------------------------------------------------------------------
-// @mixin 
+// @mixin
 
+@mixin debug-text {
+  background-color: #EBEBEB;
+  border: 1px solid #7A7A7A;
+  color: #000;
+  display: inline-block;
+  font-family: monospace, serif;
+  font-size: 8px;
+  left: 0;
+  line-height: 11px;
+  padding: 0px 2px;
+  position: absolute;
+  top: 0;
+  z-index: 999;
+}
+
 @mixin debug-styles {
   position: relative;
   &:before {
-    background-color: rgba(0,0,0,.2);
-    display: inline-block;
-    font-family: monospace, serif;
-    font-size: 8px;
-    line-height: 11px;
-    padding: 0px 2px;
-    position: absolute;
+    @include debug-text;
   }
 }
 
 @mixin debug-info( $columns, $context: $total-columns ) {
   $debug-text: "#{ $columns } of #{ $context }";
   &:before {
     content: "#{ $debug-text }";
+  }
+}
+
+@mixin debug-layout-styles {
+  @include debug-styles;
+  &:before {
+    bottom: 0;
+    padding: 1px 4px;
+    top: auto;
+    white-space: pre-wrap;
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    -o-box-sizing: border-box;
+    -ms-box-sizing: border-box;
+  }
+}
+
+@mixin debug-layout-info( $info ) {
+  &:before {
+    content: "#{ $info }";
   }
 }