ag-admin/OpenSlides
0
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Shortening motion titles

Browse Source
This commit is contained in:
Maximilian Krambach 2019-01-21 19:04:43 +01:00 committed by Emanuel Schütze
parent 209105efc3
commit 23298a03b3
2 changed files with 44 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
client/src/app/site/motions/components/motion-list/motion-list.component.html
View File

@ -50,24 +50,28 @@
<ng-container matColumnDef="title"> <ng-container matColumnDef="title">
<mat-header-cell *matHeaderCellDef mat-sort-header>Title</mat-header-cell> <mat-header-cell *matHeaderCellDef mat-sort-header>Title</mat-header-cell>
<mat-cell *matCellDef="let motion"> <mat-cell *matCellDef="let motion">
<div class="innerTable"> <div class="innerTable max-width">
<span class="motion-list-title">{{ motion.title }} <!-- title line -->
<span> <div class="motion-list">
<mat-icon inline>{{ motion.star ? 'star' : 'star_border' }}</mat-icon> <!-- attachment icon -->
</span>
</span>
<!-- attachments -->
<span class="attached-files" *ngIf="motion.hasAttachments()"> <span class="attached-files" *ngIf="motion.hasAttachments()">
<!-- <mat-basic-chip class="bluegrey"> <mat-icon>attach_file</mat-icon> </mat-basic-chip> -->
<mat-icon>attach_file</mat-icon> <mat-icon>attach_file</mat-icon>
</span> </span>
<!-- title -->
<br /> <span class="motion-list-title" matTooltip="{{ motion.title }}">
{{ motion.title }}
</span>
<!-- favorite icon -->
<span *ngIf="motion.star" class="favorite-star">
<mat-icon inline>star</mat-icon>
</span>
</div>
<!-- submitters line -->
<div class="motion-list">
<span class="motion-list-from" *ngIf="motion.submitters.length"> <span class="motion-list-from" *ngIf="motion.submitters.length">
<span translate>by</span> {{ motion.submitters }} <span translate>by</span> {{ motion.submitters }}
</span> </span>
<br *ngIf="motion.submitters.length" /> </div>
<!-- state --> <!-- state -->
<mat-basic-chip <mat-basic-chip
*ngIf="motion.state" *ngIf="motion.state"

20
client/src/app/site/motions/components/motion-list/motion-list.component.scss
View File

@ -19,12 +19,28 @@
.mat-column-title { .mat-column-title {
width: 100%; width: 100%;
flex: 1 0 200px; flex: 1 0 200px;
display: block;
padding-left: 10px; padding-left: 10px;
.motion-list {
display: flex;
padding-right: 20px;
.motion-list-title,
.motion-list-from {
flex: 2;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.motion-list-title { .motion-list-title {
font-weight: 500; font-weight: 500;
font-size: 16px; font-size: 16px;
} }
.favorite-star {
width: 26px;
}
}
.motion-list-from { .motion-list-from {
color: rgba(0, 0, 0, 0.5); color: rgba(0, 0, 0, 0.5);
@ -58,3 +74,7 @@
justify-content: flex-end !important; justify-content: flex-end !important;
} }
} }
.max-width {
width: 100%;
}