Files
nocodb/packages/nc-gui/components/workspace/integrations/Icon.vue
Mert E. 6724fd2f9d chore: sync various (#9864)
* chore: sync various

Signed-off-by: mertmit <mertmit99@gmail.com>

* test: ws scope

Signed-off-by: mertmit <mertmit99@gmail.com>

* fix(nc-gui): ncSubmenu right icon visibility issue

* fix(nc-gui): use viewTypeAlias in all the places

---------

Signed-off-by: mertmit <mertmit99@gmail.com>
Co-authored-by: Ramesh Mane <101566080+rameshmane7218@users.noreply.github.com>
2024-11-20 21:48:09 +05:30

64 lines
1.2 KiB
Vue

<script lang="ts" setup>
const props = withDefaults(
defineProps<{
integrationItem: IntegrationItemType
size?: 'xs' | 'sm' | 'md' | 'lg'
}>(),
{
size: 'md',
},
)
const { size, integrationItem } = toRefs(props)
const pxSize = computed(() => {
switch (size.value) {
case 'xs':
return '16px'
case 'sm':
return '24px'
case 'md':
return '32px'
case 'lg':
return '48px'
}
})
const pxWrapperPadding = computed(() => {
switch (size.value) {
case 'xs':
return '8px'
case 'sm':
return '8px'
default:
return '10px'
}
})
</script>
<template>
<div
class="logo-wrapper"
:style="{
padding: pxWrapperPadding,
}"
>
<GeneralIcon
v-if="typeof integrationItem === 'string'"
:icon="integrationItem"
class="text-gray-700"
:style="{ width: pxSize, height: pxSize }"
/>
<component
:is="integrationItem.icon"
v-else-if="integrationItem.icon"
class="text-gray-700"
:style="{ width: pxSize, height: pxSize }"
/>
</div>
</template>
<style lang="scss" scoped>
.logo-wrapper {
@apply bg-gray-200 rounded-lg flex items-center justify-center;
}
</style>