Fix search results on mobile

This commit is contained in:
Chocobozzz 2018-09-04 16:58:21 +02:00
parent 8cd7faaa33
commit b1ee8526d3
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
3 changed files with 9 additions and 4 deletions

View File

@ -50,7 +50,7 @@
<div class="video-info"> <div class="video-info">
<a class="video-info-name" [routerLink]="['/videos/watch', result.uuid]" [attr.title]="result.name">{{ result.name }}</a> <a class="video-info-name" [routerLink]="['/videos/watch', result.uuid]" [attr.title]="result.name">{{ result.name }}</a>
<span i18n class="video-info-date-views">{{ result.publishedAt | myFromNow }} - {{ result.views | myNumberFormatter }} views</span> <span i18n class="video-info-date-views">{{ result.publishedAt | myFromNow }} - {{ result.views | myNumberFormatter }} views</span>
<a class="video-info-account" [routerLink]="[ '/accounts', result.by ]">{{ result.by }}</a> <a class="video-info-account" [routerLink]="[ '/accounts', result.byAccount ]">{{ result.byAccount }}</a>
</div> </div>
</div> </div>
</ng-container> </ng-container>

View File

@ -23,6 +23,7 @@
} }
.results-filter-button { .results-filter-button {
cursor: pointer;
.icon.icon-filter { .icon.icon-filter {
@include icon(20px); @include icon(20px);
@ -133,7 +134,7 @@
@media screen and (max-width: 800px) { @media screen and (max-width: 800px) {
.search-result { .search-result {
margin: 20px 10px; padding: 20px 10px;
} }
.results-header { .results-header {

View File

@ -31,6 +31,7 @@ export class SearchComponent implements OnInit, OnDestroy {
private subActivatedRoute: Subscription private subActivatedRoute: Subscription
private isInitialLoad = true private isInitialLoad = true
private firstSearch = true
private channelsPerPage = 2 private channelsPerPage = 2
@ -103,13 +104,16 @@ export class SearchComponent implements OnInit, OnDestroy {
.concat(videosResult.videos) .concat(videosResult.videos)
this.pagination.totalItems = videosResult.totalVideos + videoChannelsResult.total this.pagination.totalItems = videosResult.totalVideos + videoChannelsResult.total
// Focus on channels // Focus on channels if there are no enough videos
if (this.channelsPerPage !== 10 && videosResult.videos.length < this.pagination.itemsPerPage) { if (this.firstSearch === true && videosResult.videos.length < this.pagination.itemsPerPage) {
this.resetPagination() this.resetPagination()
this.firstSearch = false
this.channelsPerPage = 10 this.channelsPerPage = 10
this.search() this.search()
} }
this.firstSearch = false
}, },
error => { error => {