Merge pull request #7925 from Budibase/fix/app-row-name-ellipsis-and-layout

Minor fix to truncate app names and a general layout fix for smaller resolutions.
This commit is contained in:
Martin McKeaveney 2022-09-25 13:38:34 +01:00 committed by GitHub
commit 10927a570b
2 changed files with 8 additions and 2 deletions

View File

@ -9,7 +9,7 @@
</script> </script>
<div class="title" data-cy={`${app.devId}`}> <div class="title" data-cy={`${app.devId}`}>
<div style="display: flex;"> <div>
<div class="app-icon" style="color: {app.icon?.color || ''}"> <div class="app-icon" style="color: {app.icon?.color || ''}">
<Icon size="XL" name={app.icon?.name || "Apps"} /> <Icon size="XL" name={app.icon?.name || "Apps"} />
</div> </div>
@ -61,6 +61,11 @@
</div> </div>
<style> <style>
div.title,
div.title > div {
display: flex;
max-width: 100%;
}
.app-row-actions { .app-row-actions {
grid-gap: var(--spacing-s); grid-gap: var(--spacing-s);
display: flex; display: flex;

View File

@ -478,9 +478,10 @@
.appTable :global(> div) { .appTable :global(> div) {
border-bottom: var(--border-light); border-bottom: var(--border-light);
} }
@media (max-width: 640px) { @media (max-width: 640px) {
.appTable { .appTable {
grid-template-columns: 1fr auto; grid-template-columns: 1fr auto !important;
} }
} }
.empty-wrapper { .empty-wrapper {