SCSS: Z-index map

$z-index: ( 'header': 4, 'content': 1 'sidebar': 2, 'modal': 5, 'footer': 3 ); @function z($type){ @if map-has-key($z-index, $type){ @return map-get($z-index, $type); } @error 'Invalid type name: `#{$type}`.'; @return null; } // Example: // .header { // z-index: z('header'); // } // .modal { // z-index: z('modal'); // }
Latest version: - Add @if check

3 Responses

Great technique, but this currently spits out an error, the map-get line should be a return instead.

@Robin Neal Thank you man, i just wrote this from mobile phone, so can make little mistake
That's cool, easy mistake to make :) Also, I just noticed there's also a trailing comma missing from line 3.

Write a comment

You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.