From d5c2188fa65515ad26ddfb4c81c0be9d656ea583 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Julius=20H=C3=A4rtl?= <jus@bitgrid.net> Date: Thu, 29 Feb 2024 08:47:11 +0100 Subject: [PATCH 1/2] fix: Limit max width of text columns and properly style them MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Julius Härtl <jus@bitgrid.net> --- .../ncTable/partials/TableCellEditor.vue | 17 ++++++++++++++--- .../components/ncTable/sections/CustomTable.vue | 1 + 2 files changed, 15 insertions(+), 3 deletions(-) diff --git a/src/shared/components/ncTable/partials/TableCellEditor.vue b/src/shared/components/ncTable/partials/TableCellEditor.vue index 23f362ab8..08c1faf59 100644 --- a/src/shared/components/ncTable/partials/TableCellEditor.vue +++ b/src/shared/components/ncTable/partials/TableCellEditor.vue @@ -33,9 +33,10 @@ export default { } </script> -<style scoped> +<style lang="scss" scoped> div { + max-width: 670px; max-height: calc(var(--default-line-height) * 6); overflow-y: scroll; min-width: 100px; @@ -44,10 +45,20 @@ div { } :deep(.text-editor__wrapper div.ProseMirror) { - padding: 0px 0px 0px 0px + padding: 0px 0px 0px 0px; + +} + +:deep(div[contenteditable='false']) { + background: transparent; + color: var(--color-main-text); + width: auto; + min-height: auto; + opacity: 1; + font-size: var(--default-font-size); } :deep(.editor__content) { - max-width: 100% !important + max-width: 100% !important; } </style> diff --git a/src/shared/components/ncTable/sections/CustomTable.vue b/src/shared/components/ncTable/sections/CustomTable.vue index c50886001..a92172013 100644 --- a/src/shared/components/ncTable/sections/CustomTable.vue +++ b/src/shared/components/ncTable/sections/CustomTable.vue @@ -299,6 +299,7 @@ export default { td, th { padding-right: 8px; + max-width: 500px; } td .showOnHover, th .showOnHover { From 495ad70bd5fec6ff7d888c1320c3cf1cd0887259 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Julius=20H=C3=A4rtl?= <jus@bitgrid.net> Date: Thu, 29 Feb 2024 08:47:28 +0100 Subject: [PATCH 2/2] fix: Properly center align the search/add row button MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Julius Härtl <jus@bitgrid.net> --- src/shared/components/ncTable/sections/Options.vue | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/shared/components/ncTable/sections/Options.vue b/src/shared/components/ncTable/sections/Options.vue index 4a617bb7f..906790dba 100644 --- a/src/shared/components/ncTable/sections/Options.vue +++ b/src/shared/components/ncTable/sections/Options.vue @@ -202,10 +202,12 @@ export default { .actionButtonsLeft { display: inline-flex; align-items: center; + padding-left: calc(var(--default-grid-baseline) * 1); } :deep(.actionButtonsLeft button) { min-width: fit-content; + margin-top: 5px; } .searchAndFilter {