MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Properly handle text overflow in plugins table

This commit is contained in:
Andrew Kingston 2023-01-09 11:26:01 +00:00
parent 6b39256184
commit ee6abf9200
1 changed files with 13 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
packages/builder/src/pages/builder/portal/plugins/_components/PluginNameRenderer.svelte
View File

@ -8,19 +8,29 @@
$: friendlyName = row?.schema?.schema?.friendlyName $: friendlyName = row?.schema?.schema?.friendlyName
</script> </script>
<div title={value}> <div class="container" title={value}>
{#if icon} {#if icon}
<Icon name={icon} /> <Icon name={icon} />
{/if} {/if}
{friendlyName || value} <div class="name">
{friendlyName || value}
</div>
</div> </div>
<style> <style>
div { .container {
flex: 1 1 auto;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
gap: var(--spacing-m); gap: var(--spacing-m);
} }
.name {
flex: 1 1 auto;
width: 0;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
</style> </style>