dendi-wang/thingsboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #13136 from vvlladd28/improvement/file-input/truncate

Browse Source 
Add to file input truncate text with tooltip
This commit is contained in:
Igor Kulikov 2025-04-08 20:20:47 +03:00 committed by GitHub
commit 0286a74953
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 4 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
ui-ngx/src/app/shared/components/file-input.component.html
View File

@ -51,9 +51,9 @@
</div> </div>
</ng-container> </ng-container>
<div class="tb-file-info-container"> <div class="tb-file-info-container">
<tb-error *ngIf="!fileName && required && requiredAsError" class="tb-file-name" error="{{ noFileText | translate }}"></tb-error> <tb-error *ngIf="!fileName && required && requiredAsError" class="font-medium" error="{{ noFileText | translate }}"></tb-error>
<div *ngIf="!fileName && !requiredAsError" class="tb-file-name" translate>{{ noFileText }}</div> <div *ngIf="!fileName && !requiredAsError" class="tb-file-name" tbTruncateWithTooltip translate>{{ noFileText }}</div>
<div *ngIf="fileName" class="tb-file-name" [title]="fileName">{{ fileName }}</div> <div *ngIf="fileName" class="tb-file-name" tbTruncateWithTooltip>{{ fileName }}</div>
<div *ngIf="maxSizeByte && !disabled" class="tb-file-hint" translate [translateParams]="{ size: maxSizeByte | fileSize }">dashboard.maximum-upload-file-size</div> <div *ngIf="maxSizeByte && !disabled" class="tb-file-hint" tbTruncateWithTooltip translate [translateParams]="{ size: maxSizeByte | fileSize }">dashboard.maximum-upload-file-size</div>
</div> </div>
</div> </div>

4
ui-ngx/src/app/shared/components/file-input.component.scss
View File

@ -131,15 +131,11 @@ $previewSize: 100px !default;
.tb-file-name { .tb-file-name {
color: rgba(0, 0, 0, 0.54); color: rgba(0, 0, 0, 0.54);
font-weight: 500; font-weight: 500;
overflow: hidden;
text-overflow: ellipsis;
} }
.tb-file-hint { .tb-file-hint {
color: rgba(0, 0, 0, 0.38); color: rgba(0, 0, 0, 0.38);
font-weight: 400; font-weight: 400;
overflow: hidden;
text-overflow: ellipsis;
} }
} }