index.less

/**
* Tag Listing
*/

#components {
  .diet-tags ( @diet-tags-url, @diet-tag-size: 20px, @gutter: 5px ){
    .diet-tag {
      display: inline-block;
      vertical-align: bottom;
      width: @diet-tag-size + 1;
      height: @diet-tag-size;
      background-size: @diet-tag-size + 1;

      &:first-child ~ & {
        margin-left: @gutter;
      }
    }

    ul > .diet-tag {
      list-style: none;
    }

    ul.diet-tags {
      margin: 0;
      padding: 0;
      // Remove whitespace
      font-size: 0;
    }

    .diet-tag-gluten-free,
    .diet-tag-glutenFree { background-image: url('@{diet-tags-url}/01_gluten.svg'); }
    .diet-tag-vegan { background-image: url('@{diet-tags-url}/02_vegan.svg'); }
    .diet-tag-vegetarian { background-image: url('@{diet-tags-url}/03_vegetarian.svg'); }
    .diet-tag-kosher { background-image: url('@{diet-tags-url}/04_kosher.svg'); }
    .diet-tag-halal { background-image: url('@{diet-tags-url}/05_halal.svg'); }
    .diet-tag-dairy-free,
    .diet-tag-dairyFree { background-image: url('@{diet-tags-url}/06_dairy.svg'); }
    .diet-tag-nuts { background-image: url('@{diet-tags-url}/07_nuts.svg'); }
    .diet-tag-spicy { background-image: url('@{diet-tags-url}/08_spicy.svg'); }
  }
}