Z-Index Map and Function

[ajmueller]

On recent projects, we've begun to use a z-index map and function. Something like this for the map:

$z-index: (
    hidden: -100,
    base: 1,
    content: 10,
    nav: 50,
    modal: 100,
    tooltip: 1000,
    fancy: 8000
);

And this for the function:

@function z($z, $options: ()) {
    $options: map-merge((
        zMap: $z-index
    ), $options);

    $zMap: map-get($options, zMap);

    // check $icon exists in $iconMap
    @if map-has-key($zMap, $z) {
        $z: map-get($zMap, $z);
    }
    @else {
        @warn "The z-index `#{$z}` is not a key in your z-index map.";
        @return null;
    }

    @return $z;
}

[stoff]

um. fancy ftw.

[ajmueller]

We had that for Fancybox, but instead I changed it to "modal" for the final implementation:

https://github.com/connectivedx/Phoenix/pull/143/files