Marmelator/common-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Crop long column titles

Browse Source
This commit is contained in:
Adina Țeudan 2021-11-11 22:41:08 +02:00
parent db7c3d6bec
commit 574a7316c3
2 changed files with 2 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/assets/styles/_common-mixins.scss
View File

@ -1,6 +1,7 @@
@mixin line-clamp($lines) { @mixin line-clamp($lines) {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
word-break: break-all;
display: -webkit-box; display: -webkit-box;
-webkit-line-clamp: $lines; /* number of lines to show */ -webkit-line-clamp: $lines; /* number of lines to show */
-webkit-box-orient: vertical; -webkit-box-orient: vertical;

2
src/lib/listing/table-column-name/table-column-name.component.html
View File

@ -1,7 +1,7 @@
<div (click)="!!sortByKey && sortingService?.toggleSort(sortByKey)" [class.pointer]="!!sortByKey" [ngClass]="class"> <div (click)="!!sortByKey && sortingService?.toggleSort(sortByKey)" [class.pointer]="!!sortByKey" [ngClass]="class">
<mat-icon *ngIf="!!leftIcon" [svgIcon]="leftIcon"></mat-icon> <mat-icon *ngIf="!!leftIcon" [svgIcon]="leftIcon"></mat-icon>
<span class="all-caps-label">{{ label }}</span> <span [matTooltip]="label" class="all-caps-label clamp-1" matTooltipPosition="above">{{ label }}</span>
<mat-icon *ngIf="!!rightIcon" [matTooltip]="rightIconTooltip | translate" [svgIcon]="rightIcon" matTooltipPosition="above"></mat-icon> <mat-icon *ngIf="!!rightIcon" [matTooltip]="rightIconTooltip | translate" [svgIcon]="rightIcon" matTooltipPosition="above"></mat-icon>