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

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

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

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

@ -19,11 +19,27 @@
.mat-column-title {
width: 100%;
flex: 1 0 200px;
display: block;
padding-left: 10px;
.motion-list-title {
font-weight: 500;
font-size: 16px;
.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 {
font-weight: 500;
font-size: 16px;
}
.favorite-star {
width: 26px;
}
}
.motion-list-from {
@ -58,3 +74,7 @@
justify-content: flex-end !important;
}
}
.max-width {
width: 100%;
}