Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
$journey: (states: complete in-progress current, packets: (strengths: blue, others: green, networking: pink, approach: yellow, coworker: purple))
@function journey-image($state, $packet-color)
@if $state == complete
@return url('/assets/journey/#{$packet-color}-gem.png')
@else
@return url('/assets/journey/#{$packet-color}-gem-outline.png')
@each $packet, $packet-color in map-get($journey, packets)
@each $state in map-get($journey, states)
.#{$state}
&##{$packet}
background-image: journey-image($state, $packet-color)
background-size: if($state == complete, 100%, 87%)
background-repeat: no-repeat
background-position: 50% 60%
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.