github/Ombi
1
0
Fork 0
mirror of https://github.com/Ombi-app/Ombi.git synced 2025-08-20 13:23:20 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fixed #4189 where when there is no poster for the searched content, we now automatically show the titles for easier discoverability

Browse source
This commit is contained in:
tidusjar 2021-06-14 08:56:19 +01:00
commit a5e72fdcde
3 changed files with 28 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.html
View file

@ -11,7 +11,7 @@
</div> </div>
<img [routerLink]="generateDetailsLink()" id="cardImage" src="{{result.posterPath}}" class="image" <img [routerLink]="generateDetailsLink()" id="cardImage" src="{{result.posterPath}}" class="image"
alt="{{result.title}}"> alt="{{result.title}}">
<div class="middle"> <div [ngClass]="result.posterPath.includes('images/') ? 'middle-show' : 'middle'">
<a class="poster-overlay" [routerLink]="generateDetailsLink()"> <a class="poster-overlay" [routerLink]="generateDetailsLink()">
<div class="summary"> <div class="summary">
<div class="title" id="title{{result.id}}">{{result.title}}</div> <div class="title" id="title{{result.id}}">{{result.title}}</div>
@ -19,7 +19,7 @@
</div> </div>
</a> </a>
</div> </div>
<div class="row button-request-container" *ngIf="!result.available && !result.approved && !result.requested"> <div [ngClass]="result.posterPath.includes('images/') ? 'button-request-container-show' : 'button-request-container'" class="row" *ngIf="!result.available && !result.approved && !result.requested">
<div class="button-request poster-overlay"> <div class="button-request poster-overlay">
<button id="requestButton{{result.id}}{{result.type}}{{discoverType}}" *ngIf="requestable" mat-raised-button class="btn-ombi full-width poster-request-btn" (click)="request($event)"> <button id="requestButton{{result.id}}{{result.type}}{{discoverType}}" *ngIf="requestable" mat-raised-button class="btn-ombi full-width poster-request-btn" (click)="request($event)">
<i *ngIf="!loading" class="fa-lg fas fa-cloud-download-alt"></i> <i *ngIf="!loading" class="fa-lg fas fa-cloud-download-alt"></i>

26
src/Ombi/ClientApp/src/app/discover/components/card/discover-card.component.scss
View file

@ -105,6 +105,17 @@ small {
-ms-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);
} }
.middle-show {
transition: .5s ease;
opacity: 1;
position: absolute;
top: 67%;
width: 90%;
left: 50%;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}
.c { .c {
position: relative; position: relative;
@ -253,12 +264,27 @@ a.poster-overlay:hover{
opacity:0; opacity:0;
transition: .5s ease; transition: .5s ease;
} }
.ombi-card .button-request-container-show{
position: relative;
width: 100%;
margin-left: 0;
margin-right: 0;
margin-top: -36px;
margin-bottom: 0px;
opacity:1;
transition: .5s ease;
}
::ng-deep .ombi-card .button-request-container .button-request{ ::ng-deep .ombi-card .button-request-container .button-request{
padding-right:0px; padding-right:0px;
padding-left:0px; padding-left:0px;
width:100%; width:100%;
} }
::ng-deep .ombi-card .button-request-container-show .button-request{
padding-right:0px;
padding-left:0px;
width:100%;
}
.c:hover .button-request-container { .c:hover .button-request-container {
opacity:1; opacity:1;

1
src/Ombi/ClientApp/src/app/search/search.component.html
View file

@ -9,7 +9,6 @@
<li role="presentation" class="active"> <li role="presentation" class="active">
<a id="movieTabButton" href="#MoviesTab" aria-controls="home" role="tab" data-toggle="tab" (click)="selectMovieTab()"><i class="fas fa-film"></i> {{ 'Search.MoviesTab' | translate }}</a> <a id="movieTabButton" href="#MoviesTab" aria-controls="home" role="tab" data-toggle="tab" (click)="selectMovieTab()"><i class="fas fa-film"></i> {{ 'Search.MoviesTab' | translate }}</a>
</li> </li>
<li role="presentation"> <li role="presentation">
<a id="tvTabButton" href="#TvShowTab" aria-controls="profile" role="tab" data-toggle="tab" (click)="selectTvTab()"><i class="fas fa-tv"></i> {{ 'Search.TvTab' | translate }}</a> <a id="tvTabButton" href="#TvShowTab" aria-controls="profile" role="tab" data-toggle="tab" (click)="selectTvTab()"><i class="fas fa-tv"></i> {{ 'Search.TvTab' | translate }}</a>
</li> </li>