proginn-frontend/components/level-tag.vue

<template>
<span v-if="level > 1" class="user-level" :class="'level-'+level"></span>
</template>

<script>
export default {
    props: ['level']
}
</script>

<style lang="scss" scoped>
@for $i from 0 through 12 {
    .level-#{$i} {
        background-image: url("~@/assets/img/level/level_#{$i}.png");
    }
}

.user-level {
    width: 25px;
    height: 15px;
    display: inline-block;
    background-size: 100% auto;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    vertical-align: baseline;
}
</style>