From e74d754f3260b86498cff85e799d155c4672f04a Mon Sep 17 00:00:00 2001 From: Martin McKeaveney Date: Wed, 28 Oct 2020 22:21:41 +0000 Subject: [PATCH] fixing attachment height --- .../DataTable/cells/AttachmentCell.svelte | 17 +++++++++++------ .../backend/DataTable/cells/cellRenderers.js | 7 +++++++ 2 files changed, 18 insertions(+), 6 deletions(-) diff --git a/packages/builder/src/components/backend/DataTable/cells/AttachmentCell.svelte b/packages/builder/src/components/backend/DataTable/cells/AttachmentCell.svelte index ed97fd366c..b8169f1398 100644 --- a/packages/builder/src/components/backend/DataTable/cells/AttachmentCell.svelte +++ b/packages/builder/src/components/backend/DataTable/cells/AttachmentCell.svelte @@ -12,8 +12,8 @@ {#if FILE_TYPES.IMAGE.includes(file.extension.toLowerCase())} {:else} - .{file.extension} + {file.name} {/if} @@ -33,12 +33,12 @@ } i { - font-size: 36px; - margin-bottom: var(--spacing-m); + font-size: 24px; + position: relative; + top: 5px; } .file { - position: relative; height: 75px; width: 75px; border: 2px dashed var(--grey-7); @@ -46,18 +46,23 @@ display: flex; flex-direction: column; align-items: center; + position: relative; justify-content: center; + overflow: hidden; + text-overflow: ellipsis; } .extension { position: absolute; - top: var(--spacing-s); - left: var(--spacing-s); + top: -5px; + font-size: var(--font-size-xs); font-weight: 500; } span { + font-size: var(--font-size-xs); width: 75px; + white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } diff --git a/packages/builder/src/components/backend/DataTable/cells/cellRenderers.js b/packages/builder/src/components/backend/DataTable/cells/cellRenderers.js index 17165f9437..209f23119f 100644 --- a/packages/builder/src/components/backend/DataTable/cells/cellRenderers.js +++ b/packages/builder/src/components/backend/DataTable/cells/cellRenderers.js @@ -31,6 +31,9 @@ export function deleteRowRenderer(params) { export function editRowRenderer(params) { const container = document.createElement("div") + container.style.height = "100%" + container.style.display = "flex" + container.style.alignItems = "center" new EditRow({ target: container, @@ -46,6 +49,9 @@ export function editRowRenderer(params) { function attachmentRenderer(options, constraints, editable) { return params => { const container = document.createElement("div") + container.style.height = "100%" + container.style.display = "flex" + container.style.alignItems = "center" const attachmentInstance = new AttachmentList({ target: container, @@ -64,6 +70,7 @@ function linkedRowRenderer() { let container = document.createElement("div") container.style.display = "grid" container.style.height = "100%" + container.style.alignItems = "center" new RelationshipDisplay({ target: container,