Fix small UI bugs

client/src/app/+videos/+video-watch/video-watch.component.ts

@@ -12,6 +12,7 @@ import {
   Notifier,
   PeerTubeSocket,
   RestExtractor,
+  ScreenService,
   ServerService,
   UserService
 } from '@app/core'
@@ -126,14 +127,10 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
     private hotkeysService: HotkeysService,
     private hooks: HooksService,
     private peertubeSocket: PeerTubeSocket,
+    private screenService: ScreenService,
     private location: PlatformLocation,
     @Inject(LOCALE_ID) private localeId: string
-  ) {
+  ) { }
-    this.tooltipLike = $localize`Like this video`
-    this.tooltipDislike = $localize`Dislike this video`
-    this.tooltipSupport = $localize`Support options for this video`
-    this.tooltipSaveToPlaylist = $localize`Save to playlist`
-  }
 
   get user () {
     return this.authService.getUser()
@@ -144,6 +141,14 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
   }
 
   async ngOnInit () {
+    // Hide the tooltips for unlogged users in mobile view, this adds confusion with the popover
+    if (this.user || !this.screenService.isInMobileView()) {
+      this.tooltipLike = $localize`Like this video`
+      this.tooltipDislike = $localize`Dislike this video`
+      this.tooltipSupport = $localize`Support options for this video`
+      this.tooltipSaveToPlaylist = $localize`Save to playlist`
+    }
+
     PeertubePlayerManager.initState()
 
     this.serverConfig = this.serverService.getTmpConfig()

client/src/app/+videos/video-list/trending/video-trending-header.component.html

@@ -1,6 +1,6 @@
 <div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" [(ngModel)]="data.model" (ngModelChange)="setSort()">
   <ng-container *ngFor="let button of buttons">
-    <label *ngIf="!button.hidden" ngbButtonLabel class="btn-light" placement="bottom" [ngbTooltip]="button.tooltip" container="body">
+    <label *ngIf="!button.hidden" ngbButtonLabel class="btn-light" placement="bottom right-bottom left-bottom" [ngbTooltip]="button.tooltip" container="body">
       <my-global-icon [iconName]="button.iconName"></my-global-icon>
       <input ngbButton type="radio" [value]="button.value"> {{ button.label }}
     </label>

client/src/app/shared/shared-share-modal/video-share.component.scss

@@ -36,6 +36,10 @@ my-input-toggle-hidden {
 .filters {
   margin-top: 30px;
 
+  .advanced-filters.show {
+    overflow: visible !important;
+  }
+
   .advanced-filters-button {
     display: flex;
     justify-content: center;