Browse Source

fix: gallery view css

Signed-off-by: mertmit <mertmit99@gmail.com>
pull/3379/head
mertmit 2 years ago
parent
commit
d7df473be8
  1. 21
      packages/nc-gui-v2/components/smartsheet/Gallery.vue

21
packages/nc-gui-v2/components/smartsheet/Gallery.vue

@ -95,28 +95,19 @@ openNewRecordFormHook?.on(async () => {
</script> </script>
<template> <template>
<div class="flex flex-col h-full w-full"> <div class="flex flex-col h-full w-full overflow-auto">
<div class="nc-gallery-container min-h-0 flex-1 grid grid-cols-4 gap-4 my-4 px-3 overflow-auto"> <div class="nc-gallery-container grid w-full min-h-0 flex-1 gap-x-2 my-4 px-3">
<div v-for="(record, recordIndex) in data" :key="recordIndex" class="flex flex-col" @click="expandForm(record)"> <div v-for="(record, recordIndex) in data" :key="recordIndex" class="flex flex-col" @click="expandForm(record)">
<Row :row="record"> <Row :row="record">
<a-card hoverable class="!rounded-lg h-full"> <a-card hoverable class="!rounded-lg h-full overflow-hidden break-all">
<template #cover> <template #cover>
<a-carousel v-if="attachments(record).length !== 0" autoplay> <a-carousel v-if="attachments(record).length !== 0" autoplay>
<img <img v-for="(attachment, index) in attachments(record)" :key="index" class="h-52" :src="attachment.url" />
v-for="(attachment, index) in attachments(record)"
:key="index"
class="h-52 rounded-t-lg"
:src="attachment.url"
/>
</a-carousel> </a-carousel>
<ImageIcon v-else class="w-full h-48 my-4 text-cool-gray-200" /> <ImageIcon v-else class="w-full h-48 my-4 text-cool-gray-200" />
</template> </template>
<div <div v-for="col in fields" :key="col.id" class="flex flex-col space-y-1 px-4 mb-6 bg-gray-50 rounded-lg w-full">
v-for="(col, colIndex) in fields"
:key="colIndex"
class="flex flex-col space-y-1 px-4 mb-6 bg-gray-50 rounded-lg w-full"
>
<div class="flex flex-row w-full justify-start border-b-1 border-gray-100 py-2.5"> <div class="flex flex-row w-full justify-start border-b-1 border-gray-100 py-2.5">
<div class="w-full text-gray-600"> <div class="w-full text-gray-600">
<SmartsheetHeaderVirtualCell v-if="isVirtualCol(col)" :column="col" :hide-menu="true" /> <SmartsheetHeaderVirtualCell v-if="isVirtualCol(col)" :column="col" :hide-menu="true" />
@ -149,6 +140,6 @@ openNewRecordFormHook?.on(async () => {
<style scoped> <style scoped>
.nc-gallery-container { .nc-gallery-container {
overflow: auto; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
} }
</style> </style>

Loading…
Cancel
Save