/* 
 * zindex.styl -- contains variables for each CSS z-index value.
 *
 * Any time you would reference a z-index in CSS, you should instead be using a
 * variable defined in either this file or a project-specific z-index file.
 * This allows for consistency and predictability in z-index definition and
 * use.
 * 
 * Each value we use is defined on the scale below, but the scale should never
 * be used directly. Instead, different applications of the scale should be
 * stored as their own variables, grouped and sorted by valur, to allow for
 * quick scanning and debugging of layering issues.
 *
 * The $zindex-10 value is reserved for debugging, via $zindex-dev.
 *
 * Shamelessly inspired by Medium:
 * https://gist.github.com/fat/1f6da6b3bd0311a1f8a0
 */

// z-index scale
$zindex-1 = 10;
$zindex-2 = 20;
$zindex-3 = 30;
$zindex-4 = 40;
$zindex-5 = 50;
$zindex-6 = 60;
$zindex-7 = 70;
$zindex-8 = 80;
$zindex-9 = 90;
$zindex-10 = 100;

// z-index applications
$zindex-dev = $zindex-10;

Add z-index system and documentation.
Add z-index system and documentation.
