1234567891011121314151617181920212223242526272829303132333435363738 |
- <script setup lang="ts">
- import { computed } from 'vue';
- const props = defineProps<{
- name: string
- width: number | string
- height: number | string
- color?: string
- }>()
- const domStyle = computed(() => ({
- width: props.width + 'px',
- height: props.height + 'px',
- }))
- </script>
- <template>
- <section class="icon-container" :style="{...domStyle, color: color}">
- <nuxt-icon :name="name" :filled="!color" style="width: 100%; height: 100%;"/>
- </section>
- </template>
- <style scoped lang="scss">
- .icon-container {
- .nuxt-icon {
- display: inline-block;
- width: 100%;
- height: 100%;
- :deep(svg) {
- width: 100%;
- height: 100%;
- margin-bottom: 0;
- }
- }
- }
- </style>
|