// set symbol class .#{$keyrune_prefix} { display: $setsymbol_display; font: $setsymbol_font; font-size: $setsymbol_font_size; line-height: $setsymbol_line_height; text-rendering: $setsymbol_text_rendering; transform: $setsymbol_transform; speak: $setsymbol_speak; text-transform: $setsymbol_text_transform; vertical-align: $setsymbol_vertical_align; // Better font rendering -webkit-font-smoothing: $setsymbol_webkit_font_smoothing; -moz-font-smoothing: $setsymbol_moz_font_smoothing; // default symbol if the set does not exist yet, or setcode does not match &:before { content: "#{$setsymbol_default_content}"; } // set symbol size modifiers @each $size in $symbol_sizes { &.#{$keyrune_prefix}-#{nth($size, 1)} { font-size: #{nth($size, 2)}; } } } // set symbol glyphs // Originally, this was inside of the .#{$keyrune_prefix} class above, // and used a '&' parent selector. // However, the loop caused a strange // interatction and printed all of the the set name comments above all // of the set glyh classes; making a giant block of comments on top of // a huge list of classes. // // Temporary solution for proper selector specificity was to prefix the // class with the same variable as the main .ss class above. @each $set in $mtg_setlist { /* #{nth($set, 1)} */ .#{$keyrune_prefix}.#{$keyrune_prefix}-#{nth($set, 2)}:before { content: "#{nth($set, 3)}"; } }