open-source-mirrors
/
Ombi
mirror of https://github.com/Ombi-app/Ombi
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Moved the buttons into icons !wip

Browse Source
pull/3895/head
tidusjar 6 years ago
parent 5bb4d133ae
commit c6d090e61a
2 changed files with 48 additions and 41 deletions
Show Stats Download Patch File Download Diff File

85
src/Ombi/ClientApp/src/app/media-details/movie-details.component.html
Unescape View File

@ -3,7 +3,7 @@
<section id="summary-wrapper">
<div class="full-screenshot enabled" [style.background-image]="movie.background"></div>
<div class="shadow-base"></div>
<div class="shadow-base" [ngClass]="movie.available ? 'available-bottom-border' : ''"></div>
<div class="container summary">
<div class="container">
@ -36,20 +36,34 @@
<!--Next to poster-->
<div class="col-6 media-row">
<a *ngIf="movie.homepage" class="media-icons" h href="{{movie.homepage}}" target="_blank">
<i matTooltip="Homepage" class="fa fa-home fa-2x grow"></i>
</a>
<a *ngIf="movie.id" href="https://www.themoviedb.org/movie/{{movie.id}}" class="media-icons" target="_blank">
<i matTooltip="The Movie DB" class="fa fa-film fa-2x grow"></i>
</a>
<a *ngIf="movie.videos.results.length > 0" class="media-icons" (click)="openDialog()"><i matTooltip="Trailer"
class="fa fa-youtube-play fa-2x grow"></i></a>
<a *ngIf="movie.imdbId" class="media-icons" href="https://imdb.com/title/{{movie.imdbId}}" target="_blank">
<i class="fa fa-imdb fa-2x grow"></i>
<i matTooltip="Imdb" class="fa fa-imdb fa-2x grow"></i>
</a>
<a *ngIf="movie.externalIds.twitterId" class="media-icons" href="https://twitter.com/{{movie.externalIds.twitterId}}"
target="_blank">
<i class="fa fa-twitter fa-2x grow"></i>
<i matTooltip="Twitter" class="fa fa-twitter fa-2x grow"></i>
</a>
<a *ngIf="movie.externalIds.facebookId" class="media-icons" href="https://facebook.com/{{movie.externalIds.facebookId}}"
target="_blank">
<i class="fa fa-facebook fa-2x grow"></i>
<i matTooltip="Facebook" class="fa fa-facebook fa-2x grow"></i>
</a> <a *ngIf="movie.externalIds.instagramId" class="media-icons" href="https://instagram.com/{{movie.externalIds.instagramId}}"
target="_blank">
<i class="fa fa-istagram fa-2x grow"></i>
<i matTooltip="Instagram" class="fa fa-instagram fa-2x grow"></i>
</a>
</div>
</div>
@ -100,49 +114,38 @@
</mat-card>
</div>
<div class="col-md-2 card-full">
<div><button mat-raised-button class="btn-green btn-spacing" *ngIf="movie.available"> {{ 'Common.Available' | translate }}</button></div>
<div><button mat-raised-button class="btn-green btn-spacing" *ngIf="movie.available"> {{
'Common.Available' | translate }}</button></div>
<div *ngIf="!movie.available">
<div *ngIf="movie.requested || movie.approved; then requestedBtn else notRequestedBtn"></div>
<ng-template #requestedBtn>
<button mat-raised-button class="btn-spacing btn-orange" [disabled]><i
class="fa fa-check"></i> {{ 'Common.Requested' | translate }}</button>
</ng-template>
<ng-template #notRequestedBtn>
<button mat-raised-button class="btn-spacing"
(click)="request()">
<i *ngIf="movie.requestProcessing" class="fa fa-circle-o-notch fa-spin fa-fw"></i> <i
*ngIf="!movie.requestProcessing && !movie.processed" class="fa fa-plus"></i>
<i *ngIf="movie.processed && !movie.requestProcessing" class="fa fa-check"></i> {{
'Common.Request' | translate }}</button>
</ng-template>
</div>
<div *ngIf="movie.requested || movie.approved; then requestedBtn else notRequestedBtn"></div>
<ng-template #requestedBtn>
<button mat-raised-button class="btn-spacing btn-orange" [disabled]><i class="fa fa-check"></i>
{{ 'Common.Requested' | translate }}</button>
</ng-template>
<ng-template #notRequestedBtn>
<button mat-raised-button class="btn-spacing" (click)="request()">
<i *ngIf="movie.requestProcessing" class="fa fa-circle-o-notch fa-spin fa-fw"></i> <i
*ngIf="!movie.requestProcessing && !movie.processed" class="fa fa-plus"></i>
<i *ngIf="movie.processed && !movie.requestProcessing" class="fa fa-check"></i> {{
'Common.Request' | translate }}</button>
</ng-template>
</div>
<div><button mat-raised-button class="btn-spacing" color="warn">Deny</button></div>
<div *ngIf="result.available">
<a *ngIf="result.plexUrl" mat-raised-button style="text-align: right" class="btn-spacing btn-greem" href="{{result.plexUrl}}"
target="_blank"><i class="fa fa-eye"></i> {{'Search.ViewOnPlex' | translate}}</a>
<a *ngIf="result.embyUrl" mat-raised-button class="btn-green btn-spacing"
href="{{result.embyUrl}}" target="_blank"><i class="fa fa-eye"></i> {{'Search.ViewOnEmby' |
translate}}</a>
</div>
<div *ngIf="movie.available">
<a *ngIf="movie.plexUrl" mat-raised-button style="text-align: right" class="btn-spacing btn-greem"
href="{{movie.plexUrl}}" target="_blank"><i class="fa fa-eye"></i> {{'Search.ViewOnPlex' |
translate}}</a>
<a *ngIf="movie.embyUrl" mat-raised-button class="btn-green btn-spacing" href="{{movie.embyUrl}}"
target="_blank"><i class="fa fa-eye"></i> {{'Search.ViewOnEmby' |
translate}}</a>
</div>
</div>
</div>
<div class="row card-spacer">
<div class="col-md-2">
<div>
<div>
<a *ngIf="movie.homepage" class="btn-spacing" href="{{movie.homepage}}" target="_blank"
mat-raised-button color="accent">Home Page</a></div>
<div>
<a *ngIf="movie.id" href="https://www.themoviedb.org/movie/{{movie.id}}" target="_blank"
mat-raised-button class="btn-blue btn-spacing">The Movie DB</a></div>
<div>
<a *ngIf="movie.imdbId" href="https://www.imdb.com/title/tt1727824/{{movie.imdbId}}" target="_blank"
mat-raised-button class="imdb-color btn-spacing">IMDb</a></div>
<div>
<a *ngIf="movie.videos.results.length > 0" mat-raised-button class="btn-blue btn-spacing"
(click)="openDialog()">Trailer</a></div>
</div>
</div>
</div>

4
src/Ombi/ClientApp/src/app/media-details/movie-details.component.scss
Unescape View File

@ -69,6 +69,10 @@ $ombi-primary:#3f3f3f;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#4D000000', GradientType=0);
}
.available-bottom-border {
border-bottom: solid 8px #1DE9B6;
}
#summary-wrapper .summary .container,
.summary-wrapper .summary .container {
position: absolute;

Write Preview
Loading…
Cancel
Save