From befc57f310540dead8d50de28519dfd94a442acf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lukas=20Mau=C3=9F?= <lukas.mauss@mni.thm.de>
Date: Mon, 4 Mar 2019 03:10:48 +0100
Subject: [PATCH] Fix layout of content-list-component
---
.../creator/content-list/content-list.component.html | 5 +++--
.../creator/content-list/content-list.component.scss | 10 +++++++++-
.../creator/content-list/content-list.component.ts | 2 +-
3 files changed, 13 insertions(+), 4 deletions(-)
diff --git a/src/app/components/creator/content-list/content-list.component.html b/src/app/components/creator/content-list/content-list.component.html
index f5e939b8a..b82d330ac 100644
--- a/src/app/components/creator/content-list/content-list.component.html
+++ b/src/app/components/creator/content-list/content-list.component.html
@@ -39,11 +39,12 @@
<mat-panel-title>
{{ content.subject }}
</mat-panel-title>
- <button mat-icon-button color="accent" (click)="editContent(content);$event.stopPropagation();">
+ <button mat-icon-button color="accent" (click)="editContent(content);$event.stopPropagation();"
+ class="editButton">
<mat-icon>create</mat-icon>
</button>
<button mat-icon-button color="warn" (click)="deleteContent(content);$event.stopPropagation();"
- class="deleteButton">
+ class="deleteButton editButton">
<mat-icon>delete_forever</mat-icon>
</button>
</mat-expansion-panel-header>
diff --git a/src/app/components/creator/content-list/content-list.component.scss b/src/app/components/creator/content-list/content-list.component.scss
index f1208e902..38a8e68d9 100644
--- a/src/app/components/creator/content-list/content-list.component.scss
+++ b/src/app/components/creator/content-list/content-list.component.scss
@@ -16,10 +16,13 @@ mat-panel-title {
flex-basis: 0;
align-items: center;
font-size: medium;
+ margin-right: 5px;
}
mat-expansion-panel-header {
background-color: #bbdefb !important;
+ padding-left: 3%;
+ padding-right: 3%;
}
.mat-expansion-panel-header-title {
@@ -39,8 +42,13 @@ h2 {
}
}
+.editButton {
+ width: 15%;
+ max-width: 60px;
+}
+
.deleteButton {
- margin-right: 15px;
+ margin-right: 4%;
}
mat-tooltip-component {
diff --git a/src/app/components/creator/content-list/content-list.component.ts b/src/app/components/creator/content-list/content-list.component.ts
index 256a157a6..c483d4e66 100644
--- a/src/app/components/creator/content-list/content-list.component.ts
+++ b/src/app/components/creator/content-list/content-list.component.ts
@@ -57,7 +57,7 @@ export class ContentListComponent implements OnInit {
}
ngOnInit() {
- this.labelMaxLength = innerWidth / 30;
+ this.labelMaxLength = innerWidth / 20;
this.roomId = localStorage.getItem(`roomId`);
this.roomService.getRoom(this.roomId).subscribe(room => {
this.room = room;
--
GitLab