Browse Source

refactor(nc-gui): attachment width style

pull/5046/head
Wing-Kam Wong 2 years ago
parent
commit
1fd89c3d23
  1. 6
      packages/nc-gui/components/cell/attachment/Carousel.vue
  2. 9
      packages/nc-gui/components/cell/attachment/Image.vue

6
packages/nc-gui/components/cell/attachment/Carousel.vue

@ -83,7 +83,7 @@ onClickOutside(carouselRef, () => {
</template> </template>
<template #customPaging="props"> <template #customPaging="props">
<div class="cursor-pointer h-full"> <div class="cursor-pointer h-full nc-attachment-img-wrapper">
<LazyCellAttachmentImage <LazyCellAttachmentImage
class="!block margin-auto h-full w-full" class="!block margin-auto h-full w-full"
:alt="imageItems[props.i].title || `#${props.i}`" :alt="imageItems[props.i].title || `#${props.i}`"
@ -142,4 +142,8 @@ onClickOutside(carouselRef, () => {
.ant-carousel :deep(.custom-slick-arrow:hover) { .ant-carousel :deep(.custom-slick-arrow:hover) {
opacity: 0.5; opacity: 0.5;
} }
.nc-attachment-img-wrapper {
width: fit-content !important;
}
</style> </style>

9
packages/nc-gui/components/cell/attachment/Image.vue

@ -14,7 +14,7 @@ const onError = () => index.value++
<template> <template>
<LazyNuxtImg <LazyNuxtImg
v-if="index < props.src.length" v-if="index < props.src.length"
class="nc-attachment-img" class="m-auto"
:src="props.src[index]" :src="props.src[index]"
:onerror="onError" :onerror="onError"
:alt="props?.alt || ''" :alt="props?.alt || ''"
@ -23,10 +23,3 @@ const onError = () => index.value++
/> />
<MdiFileImageBox v-else /> <MdiFileImageBox v-else />
</template> </template>
<style scoped lang="scss">
.nc-attachment-img {
width: fit-content !important;
@apply m-auto;
}
</style>

Loading…
Cancel
Save