Updated look of file cards so that the images are of equal size

This commit is contained in:
Isaac Grynsztein
2020-03-13 00:33:02 -04:00
parent bad4b8630b
commit c752b13732
3 changed files with 9 additions and 7 deletions

View File

@@ -33,9 +33,9 @@
} }
.img-div { .img-div {
max-height: 80px; height: 60px;
padding: 0px; padding: 0px;
margin: 0px 0px 0px -5px; margin: 8px 0px 0px -5px;
width: calc(100% + 5px + 5px); width: calc(100% + 5px + 5px);
} }

View File

@@ -1,9 +1,11 @@
<mat-card class="example-card mat-elevation-z6"> <mat-card class="example-card mat-elevation-z6">
<div style="padding:5px"> <div style="padding:5px">
<b><a href="javascript:void(0)" (click)="!isPlaylist ? mainComponent.goToFile(name, isAudio) : mainComponent.goToPlaylist(name, type)">{{title}}</a></b> <div style="height: 52px;">
<br/> <b><a href="javascript:void(0)" (click)="!isPlaylist ? mainComponent.goToFile(name, isAudio) : mainComponent.goToPlaylist(name, type)">{{title}}</a></b>
<span class="max-two-lines">ID: {{name}}</span> <br/>
<div *ngIf="isPlaylist">Count: {{count}}</div> <span class="max-two-lines">ID: {{name}}</span>
<div *ngIf="isPlaylist">Count: {{count}}</div>
</div>
<div *ngIf="!image_errored && thumbnailURL" class="img-div"> <div *ngIf="!image_errored && thumbnailURL" class="img-div">
<img class="image" (error) ="onImgError($event)" [id]="type" [lazyLoad]="thumbnailURL" [customObservable]="scrollAndLoad" (onLoad)="imageLoaded($event)" alt="Thumbnail"> <img class="image" (error) ="onImgError($event)" [id]="type" [lazyLoad]="thumbnailURL" [customObservable]="scrollAndLoad" (onLoad)="imageLoaded($event)" alt="Thumbnail">
<span *ngIf="!image_loaded"> <span *ngIf="!image_loaded">

View File

@@ -18,7 +18,7 @@ export class SubscriptionsComponent implements OnInit {
subscriptions_loading = false; subscriptions_loading = false;
constructor(private dialog: MatDialog, private postsService: PostsService, private router: Router, private snackBar: MatSnackBar) { } constructor(private dialog: MatDialog, public postsService: PostsService, private router: Router, private snackBar: MatSnackBar) { }
ngOnInit() { ngOnInit() {
this.getSubscriptions(); this.getSubscriptions();