Захаров Дмитрий Анатольевич
36 lines
820 B
Vue
36 lines
820 B
Vue
<template>
|
|
<i :class="['beeline-icons', `beeline-icons-${icon}`, classes]"></i>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { Icons } from '@beeline/design-tokens/js/iconfont/icons';
|
|
import { computed, useCssModule } from 'vue';
|
|
|
|
const { size = 'medium' } = defineProps<{
|
|
icon: Icons,
|
|
size?: 'large' | 'medium' | 'small'
|
|
}>()
|
|
|
|
const style = useCssModule()
|
|
const classes = computed(() => ({
|
|
[style.CustomIcon]: true,
|
|
[style.CustomIconLarge]: size === 'large',
|
|
[style.CustomIconSmall]: size === 'small'
|
|
}))
|
|
</script>
|
|
|
|
<style lang="scss" module>
|
|
@use "@beeline/design-tokens/scss/tokens/components/icon";
|
|
|
|
.CustomIcon {
|
|
font-size: icon.$icon-medium-size !important;
|
|
|
|
&Large {
|
|
font-size: icon.$icon-large-size !important;
|
|
}
|
|
|
|
&Small {
|
|
font-size: icon.$icon-small-size !important;
|
|
}
|
|
}
|
|
</style> |