diff --git a/packages/nc-gui/components/cell/attachment/Carousel.vue b/packages/nc-gui/components/cell/attachment/Carousel.vue index 6e66cca0e3..6b88730142 100644 --- a/packages/nc-gui/components/cell/attachment/Carousel.vue +++ b/packages/nc-gui/components/cell/attachment/Carousel.vue @@ -88,7 +88,7 @@ watchOnce(emblaMainApi, async (emblaMainApi) => { > -
+
{ +
{{ item.title }}
@@ -143,6 +147,7 @@ watchOnce(emblaMainApi, async (emblaMainApi) => { >
+
@@ -162,7 +167,11 @@ watchOnce(emblaMainApi, async (emblaMainApi) => { } .carousel-container { - @apply !w-full; + @apply !w-full flex items-center h-full; + + .embla__container { + @apply items-center h-full w-full; + } } .vjs-fluid { diff --git a/packages/nc-gui/components/cell/attachment/Preview/Pdf.vue b/packages/nc-gui/components/cell/attachment/Preview/Pdf.vue new file mode 100644 index 0000000000..33c172e5f8 --- /dev/null +++ b/packages/nc-gui/components/cell/attachment/Preview/Pdf.vue @@ -0,0 +1,13 @@ + + + + + diff --git a/packages/nc-gui/components/nc/Carousel/Item.vue b/packages/nc-gui/components/nc/Carousel/Item.vue index fbc05cf1c9..439d3ff2f7 100644 --- a/packages/nc-gui/components/nc/Carousel/Item.vue +++ b/packages/nc-gui/components/nc/Carousel/Item.vue @@ -11,7 +11,7 @@ const props = defineProps() :class="{ [props.class]: props.class, }" - class="min-w-0 shrink-0 flex justify-center items-center embla__slide grow-0 basis-full" + class="min-w-0 shrink-0 flex justify-center items-center embla__slide h-full grow-0 basis-full" >
diff --git a/packages/nc-gui/utils/fileUtils.ts b/packages/nc-gui/utils/fileUtils.ts index 6fd7a47ef0..46c1f6f350 100644 --- a/packages/nc-gui/utils/fileUtils.ts +++ b/packages/nc-gui/utils/fileUtils.ts @@ -44,7 +44,11 @@ const isImage = (name: string, mimetype?: string) => { return imageExt.some((e) => name?.toLowerCase().endsWith(`.${e}`)) || mimetype?.startsWith('image/') } -export { isImage, imageExt, isVideo } +const isPdf = (name: string, mimetype?: string) => { + return name?.toLowerCase().endsWith('.pdf') || mimetype?.startsWith('application/pdf') +} + +export { isImage, imageExt, isVideo, isPdf } // Ref : https://stackoverflow.com/a/12002275 // Tested in Mozilla Firefox browser, Chrome