Resize content-groups in room view

src/app/components/shared/content-groups/content-groups.component.html

 <mat-card *ngFor="let contentGroup of contentGroups" (click)="viewContents(contentGroup)">
   <mat-card-header>
     <mat-card-title>
-      <h4 *ngIf="!(contentGroup.name == 'Default')">{{contentGroup.name}}<mat-icon color="accent"
-         matBadge="{{contentGroup.contentIds.length}}" matBadgePosition="after" matBadgeColor="accent"></mat-icon></h4>
-      <h4 *ngIf="contentGroup.name == 'Default'">{{'room-page.default-content-group' | translate}}<mat-icon color="accent"
+      <h4 *ngIf="!(contentGroup.name === 'Default')">{{contentGroup.name}}<mat-icon color="accent"
          matBadge="{{contentGroup.contentIds.length}}" matBadgePosition="after" matBadgeColor="accent"></mat-icon></h4>
+      <h4 *ngIf="contentGroup.name === 'Default'">{{'room-page.default-content-group' | translate}}<mat-icon color="accent"
+         matBadge="{{contentGroup.contentIds.length}}" matBadgePosition="end" matBadgeColor="accent"></mat-icon></h4>
     </mat-card-title>
   </mat-card-header>
 </mat-card>

src/app/components/shared/content-groups/content-groups.component.scss

@@ -8,7 +8,9 @@
   top: 0;
   text-align: center;
   transition: all 0.25s;
-  margin-top: 1.5%;
+  margin-top: 10px;
+  max-height: 80px;
+  padding: 5px; 
 
   &:hover {
     cursor: pointer;