Ticket: -Dataset Template chip should be one line (no wrap) with a fixed width. In hover the full text should be displayed.

This commit is contained in:
apapachristou 2019-05-14 13:17:33 +03:00
parent 55dd9800e9
commit c8844fba08
7 changed files with 22 additions and 7 deletions

View File

@ -32,7 +32,7 @@
<mat-icon class="gray-icon pt-2">assignment</mat-icon>
<div class="pt-1">
<div class="chip ml-2 mr-2">{{ dataset.profile }}</div>
<div matTooltip="{{ dataset.profile }}" class="chip ml-2 mr-2">{{ dataset.profile }}</div>
</div>
</div>
</div>

View File

@ -29,6 +29,7 @@ h4 {
.about-item {
display: flex;
flex-wrap: wrap;
}
.about-item .length {

View File

@ -45,7 +45,7 @@
<mat-icon class="gray-icon pt-2">assignment</mat-icon>
<div *ngFor="let profile of dmp.associatedProfiles" class="pt-1">
<div class="chip ml-2 mr-2">{{profile.label}}</div>
<div matTooltip="{{profile.label}}" class="chip ml-2 mr-2">{{profile.label}}</div>
</div>
<p>Published {{dmp.creationTime | date: "shortDate"}}</p>
</div>

View File

@ -12,6 +12,7 @@
.about-item {
display: flex;
flex-wrap: wrap;
}
.about-item .length {

View File

@ -2,7 +2,7 @@
<div class="col" (click)="itemClicked()">
<div class="row">
<div class="col-12 gray-container container-header">
{{dmp.projectabbreviation}}
{{dmp.projectAbbreviation}}
</div>
</div>
<div class="row">
@ -26,7 +26,7 @@
<mat-icon class="gray-icon pt-2">assignment</mat-icon>
<div *ngFor="let profile of dmp.associatedProfiles" class="pt-1">
<div class="chip ml-2 mr-2">{{profile.label}}</div>
<div matTooltip="{{profile.label}}" class="chip ml-2 mr-2">{{profile.label}}</div>
</div>
<p>Published {{dmp.creationTime | date: "shortDate"}}</p>
</div>

View File

@ -12,6 +12,7 @@
.about-item {
display: flex;
flex-wrap: wrap;
}
.about-item .length {

View File

@ -59,6 +59,10 @@ $theme: mat-light-theme($primary, $accent);
color: #fff;
text-transform: uppercase;
font-weight: 500;
max-width: 160px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.bordered-chip {
@ -69,6 +73,10 @@ $theme: mat-light-theme($primary, $accent);
color: rgb(68, 114, 196);
text-transform: uppercase;
font-weight: 500;
max-width: 160px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.squared-chip {
@ -77,6 +85,10 @@ $theme: mat-light-theme($primary, $accent);
border-radius: 0.5em;
background-color: rgb(246, 246, 246);
color: rgb(127, 127, 127);
max-width: 160px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
mat-icon {