Cutlery/Kyoo
1
0
Fork 0
mirror of https://github.com/zoriya/Kyoo.git synced 2025-07-09 03:04:20 -04:00
Code Issues Packages Projects Releases Wiki Activity

Adding external ids to the identify tab

Browse Source
This commit is contained in:
Zoe Roux 2020-04-26 21:32:59 +02:00
parent 5ac1dbd615
commit 1f070d9d14
5 changed files with 62 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/metadata-edit/metadata-edit.component.html
View File

@ -1,12 +1,12 @@
<h2 mat-dialog-title>Editing metadata of {{this.show.title}}</h2> <h2 mat-dialog-title>Editing metadata of {{this.show.title}}</h2>
<div matDialogContent class="pb-2"> <div matDialogContent class="pb-4">
<mat-accordion> <mat-accordion>
<mat-expansion-panel expanded="true"> <mat-expansion-panel expanded="true">
<mat-expansion-panel-header> <mat-expansion-panel-header>
<mat-panel-title>Edit metadata</mat-panel-title> <mat-panel-title>Edit metadata</mat-panel-title>
<mat-panel-description>Manually edit each property</mat-panel-description> <mat-panel-description>Manually edit each property</mat-panel-description>
</mat-expansion-panel-header> </mat-expansion-panel-header>
<form #showForm="ngForm"> <form #showForm="ngForm" class="pt-3">
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>Title</mat-label> <mat-label>Title</mat-label>
<input matInput [(ngModel)]="this.show.title" name="title"> <input matInput [(ngModel)]="this.show.title" name="title">

2
src/app/show-details/show-details.component.html
View File

@ -58,7 +58,7 @@
<p class="text-justify overview">{{this.show.overview}}</p> <p class="text-justify overview">{{this.show.overview}}</p>
<ul> <ul>
<li class="provider" *ngFor="let id of this.show.externalIDs"> <li class="provider" *ngFor="let id of this.show.externalIDs">
<a [href]="id.link"><img class="provider-icon" [src]="id.provider.logo" [alt]="id.provider.name"/></a> <a [href]="id.link"><img [src]="id.provider.logo" [alt]="id.provider.name"/></a>
</li> </li>
</ul> </ul>
</div> </div>

32
src/app/show-details/show-details.component.scss
View File

@ -153,14 +153,28 @@ hr
.provider .provider
{ {
display: inline; display: inline-block;
width: 4rem; width: 3rem;
height: 4rem; height: 3rem;
margin: .5rem; margin: .5rem;
}
> a
.provider-icon {
{ width: 3rem;
max-width: 4rem; height: 3rem;
max-height: 4rem; position: relative;
display: inline-block;
> img
{
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
margin: auto;
max-width: 3rem;
max-height: 3rem;
}
}
} }

5
src/app/show-grid/show-grid.component.html
View File

@ -10,6 +10,11 @@
<p class="date" *ngIf="show.endYear && show.startYear != show.endYear; else elseBlock">{{show.startYear}} - {{show.endYear}}</p> <p class="date" *ngIf="show.endYear && show.startYear != show.endYear; else elseBlock">{{show.startYear}} - {{show.endYear}}</p>
<ng-template #elseBlock><p class="date">{{show.startYear}}</p></ng-template> <ng-template #elseBlock><p class="date">{{show.startYear}}</p></ng-template>
<p class="overview">{{show.overview}}</p> <p class="overview">{{show.overview}}</p>
<ul>
<li class="provider" *ngFor="let id of this.show.externalIDs">
<a [href]="id.link"><img [src]="id.provider.logo" [alt]="id.provider.name"/></a>
</li>
</ul>
</div> </div>
</a> </a>
</mat-card> </mat-card>

32
src/app/show-grid/show-grid.component.scss
View File

@ -100,9 +100,10 @@ button
> .overview > .overview
{ {
overflow-y: auto; overflow-y: auto;
height: calc(100% - 2rem); height: calc(100% - 4rem);
text-align: justify; text-align: justify;
padding-right: .5rem; padding-right: .5rem;
margin-bottom: 0;
} }
&:host-context(.hoverEnabled) &:hover &:host-context(.hoverEnabled) &:hover
@ -112,3 +113,32 @@ button
} }
} }
} }
.provider
{
display: inline-block;
width: 2.5rem;
height: 2.5rem;
margin: .25rem;
> a
{
width: 2.5rem;
height: 2.5rem;
position: relative;
display: inline-block;
> img
{
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
margin: auto;
max-width: 2.5rem;
max-height: 2.5rem;
}
}
}