hummingbird-me/kitsu-web

View on GitHub
app/styles/layout/_z-index.scss

Summary

Maintainability
Test Coverage
// Kitsu's z-index scale. Z-index values should always be defined in z-index.scss. This
// allows us to at a glance determine relative layers of our application and prevents bugs
// arising from arbitrary z-index values. Do not edit the z-index scale! @z-index-9 is the
// kill -9 of our z-index scale and really should never be used.


// Z-Index Scale (private vars)
$zIndex-1:  100;
$zIndex-2:  200;
$zIndex-3:  300;
$zIndex-4:  400;
$zIndex-5:  500;
$zIndex-6:  600;
$zIndex-7:  700;
$zIndex-8:  800;
$zIndex-9:  900;

// Z-Index Applications
$zIndex--modal-user-avatar:     $zIndex-1;
$zIndex--stream-item-block:     $zIndex-1;
$zIndex--recipient-avatar:      $zIndex-1;
$zIndex--stream-comments:       $zIndex-1;

$zIndex--author-avatar:         $zIndex-2;

$zIndex--dark-cover-overlay:    $zIndex-3;

$zIndex--cover-user-info:       $zIndex-4;
$zIndex--cover-profiles:        $zIndex-3;
$zIndex--profile-primary-info:  $zIndex-4;
$zIndex--staging-alert:         $zIndex-4;

$zIndex--primary-nav:           $zIndex-5;