fix(editor): Restore 3-line clamp on MCP workflow description cell

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Charlie Kolb
2026-06-19 09:17:22 +02:00
parent 0569275198
commit 58b6945f23
@@ -228,11 +228,7 @@ const onConnectClick = () => {
:class="$style['description-cell']"
@click="emit('updateDescription', item)"
>
<N8nText
v-if="item.description"
:class="$style['description-text']"
data-test-id="mcp-workflow-description"
>
<N8nText v-if="item.description" data-test-id="mcp-workflow-description">
{{ item.description }}
</N8nText>
<span v-else :class="$style['empty-description']">
@@ -302,29 +298,23 @@ const onConnectClick = () => {
}
.description-cell {
// Shrink to the text so the tooltip is anchored near it, not centered on the column
display: inline-block;
// inline-box shrinks to the text (so the tooltip anchors near it) while still
// clamping the description to 3 lines; max-width keeps long text within the column
display: -webkit-inline-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
line-clamp: 3;
overflow: hidden;
max-width: 100%;
color: var(--color--text);
padding: var(--spacing--2xs) 0;
cursor: pointer;
&:hover span {
&:hover {
color: var(--color--text--shade-1);
}
}
// Line clamping only works on inline content, so it has to live on the
// text element itself rather than on a wrapper with non-inline children
.description-text {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
line-clamp: 3;
overflow: hidden;
word-break: break-word;
}
.empty-description {
display: flex;
align-items: center;