fix: fix overflowing interface table (#3027)

This commit is contained in:
Alex Inkin
2025-09-20 20:10:58 +07:00
committed by GitHub
parent b99f3b73cd
commit 876e5bc683

View File

@@ -24,8 +24,8 @@ import { TuiBadge } from '@taiga-ui/kit'
{{ 'Address details' | i18n }} {{ 'Address details' | i18n }}
</button> </button>
</td> </td>
<td [style.width.rem]="6">{{ address.type }}</td> <td>{{ address.type }}</td>
<td [style.width.rem]="5"> <td>
@if (address.access === 'public') { @if (address.access === 'public') {
<tui-badge size="s" appearance="primary-success"> <tui-badge size="s" appearance="primary-success">
{{ 'public' | i18n }} {{ 'public' | i18n }}
@@ -38,20 +38,41 @@ import { TuiBadge } from '@taiga-ui/kit'
- -
} }
</td> </td>
<td [style.width.rem]="10" [style.order]="-1"> <td [style.order]="-1">
{{ address.gatewayName || '-' }} <div [title]="address.gatewayName">
{{ address.gatewayName || '-' }}
</div>
</td>
<td>
<div [title]="address.url">{{ address.url }}</div>
</td> </td>
<td>{{ address.url }}</td>
<td <td
actions actions
[disabled]="!isRunning()" [disabled]="!isRunning()"
[href]="address.url" [href]="address.url"
[style.width.rem]="7" [style.width.rem]="5"
(onDetails)="viewDetails(address.bullets)" (onDetails)="viewDetails(address.bullets)"
></td> ></td>
} }
`, `,
styles: ` styles: `
:host {
white-space: nowrap;
td:last-child {
padding-inline-start: 0;
}
}
div {
white-space: normal;
word-break: break-all;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
}
:host-context(tui-root._mobile) { :host-context(tui-root._mobile) {
td { td {
width: auto !important; width: auto !important;