@use 'sass:map'; /// Global spacing value $space-unit: 8px; // Bootstrap color system // * with added shades of gray (+) $white: #FFFFFF; $gray-50 : #FCFCFC; // (+) $gray-100: #F8F9FA; $gray-150: #FAFAFA; // (+) $gray-175: #F0F0F0; // (+) $gray-200: #E9ECEF; $gray-300: #DEE2E6; $gray-400: #CED4DA; $gray-500: #ADB5BD; $gray-600: #6C757D; $gray-700: #495057; $gray-800: #343A40; $gray-900: #212529; $black: #000000; // Pastel colours $pastel-green : hsla(149, 46%, 41%, 1); $pastel-blue : hsla(206, 28%, 55%, 1); $pastel-yellow : hsla(60, 100%, 71%, 1); $pastel-red : hsla(3, 60%, 59%, 1); $pastel-orange : hsla(40, 89%, 75%, 1); $pastel-purple : hsla(278, 19%, 74%, 1); /// Z-Index Management /// @link https://medium.com/alistapart/sassier-z-index-management-for-complex-layouts-4540717a9488 $z-indexes: ( main: ( "sidebar", "topbar", "handlebar", "floaty", ), phylo: ( "frame", "spinner", ), graph: ( "toolbar", "frame", ), tree: ( "content", "badge", ), tile: ( "bottom-teaser" "navbar", "top-teaser", ), corpus-code: ( "content", "toolbar", ), );