From 173f7004a6b0e4210d7f659dbcdce7cb606f81c5 Mon Sep 17 00:00:00 2001
From: Timo <timo@devplant.ro>
Date: Wed, 25 Nov 2020 13:12:51 +0200
Subject: [PATCH] minor adjustments to tooltips

---
 .../file-actions/file-actions.component.html       |  1 +
 .../file-preview-screen.component.html             |  2 +-
 .../page-indicator/page-indicator.component.ts     | 14 +++++++++++---
 .../project-overview-screen.component.html         |  2 +-
 apps/red-ui/src/assets/styles/red-tooltips.scss    |  2 +-
 5 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/apps/red-ui/src/app/common/file-actions/file-actions.component.html b/apps/red-ui/src/app/common/file-actions/file-actions.component.html
index 0df3d294f..2e7c7a797 100644
--- a/apps/red-ui/src/app/common/file-actions/file-actions.component.html
+++ b/apps/red-ui/src/app/common/file-actions/file-actions.component.html
@@ -33,6 +33,7 @@
         (action)="downloadFileRedactionReport($event, fileStatus)"
         *ngIf="permissionsService.canShowRedactionReportDownloadBtn(fileStatus)"
         [tooltipPosition]="tooltipPosition"
+        [tooltipClass]="'small'"
         [tooltip]="fileStatus.isApproved ? 'report.action' : 'report.unavailable-single'"
         [disabled]="!fileStatus.isApproved"
         icon="red:report"
diff --git a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html
index ce2b89683..9cc053663 100644
--- a/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html
+++ b/apps/red-ui/src/app/screens/file/file-preview-screen/file-preview-screen.component.html
@@ -65,7 +65,7 @@
                 class="ml-8"
                 [routerLink]="['/ui/projects/' + appStateService.activeProjectId]"
                 tooltip="common.close"
-                tooltipPosition="below"
+                tooltipPosition="before"
                 icon="red:close"
             ></redaction-circle-button>
         </div>
diff --git a/apps/red-ui/src/app/screens/file/page-indicator/page-indicator.component.ts b/apps/red-ui/src/app/screens/file/page-indicator/page-indicator.component.ts
index 979570d5e..29d7fbe39 100644
--- a/apps/red-ui/src/app/screens/file/page-indicator/page-indicator.component.ts
+++ b/apps/red-ui/src/app/screens/file/page-indicator/page-indicator.component.ts
@@ -1,15 +1,16 @@
-import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
+import { Component, EventEmitter, Input, OnChanges, OnDestroy, OnInit, Output, SimpleChanges } from '@angular/core';
 import { ViewedPages, ViewedPagesControllerService } from '@redaction/red-ui-http';
 import { AppStateService } from '../../../state/app-state.service';
 import { PermissionsService } from '../../../common/service/permissions.service';
 import { AppConfigKey, AppConfigService } from '../../../app-config/app-config.service';
+import { Subscription } from 'rxjs';
 
 @Component({
     selector: 'redaction-page-indicator',
     templateUrl: './page-indicator.component.html',
     styleUrls: ['./page-indicator.component.scss']
 })
-export class PageIndicatorComponent implements OnChanges, OnInit {
+export class PageIndicatorComponent implements OnChanges, OnInit, OnDestroy {
     @Input() active: boolean;
     @Input() number: number;
     @Input() viewedPages: ViewedPages;
@@ -18,6 +19,7 @@ export class PageIndicatorComponent implements OnChanges, OnInit {
 
     pageReadTimeout: number = null;
     canMarkPagesAsViewed: boolean;
+    private _subscription: Subscription;
 
     constructor(
         private readonly _viewedPagesControllerService: ViewedPagesControllerService,
@@ -27,7 +29,7 @@ export class PageIndicatorComponent implements OnChanges, OnInit {
     ) {}
 
     ngOnInit(): void {
-        this._appStateService.fileChanged.subscribe(() => {
+        this._subscription = this._appStateService.fileChanged.subscribe(() => {
             this.canMarkPagesAsViewed = this._permissionService.canMarkPagesAsViewed();
         });
     }
@@ -97,4 +99,10 @@ export class PageIndicatorComponent implements OnChanges, OnInit {
             }
         }
     }
+
+    ngOnDestroy(): void {
+        if (this._subscription) {
+            this._subscription.unsubscribe();
+        }
+    }
 }
diff --git a/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html b/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html
index 89952af01..40d84f66c 100644
--- a/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html
+++ b/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html
@@ -63,7 +63,7 @@
                 class="ml-6"
                 [routerLink]="['/ui/projects/']"
                 tooltip="common.close"
-                tooltipPosition="below"
+                tooltipPosition="before"
                 icon="red:close"
             ></redaction-circle-button>
 
diff --git a/apps/red-ui/src/assets/styles/red-tooltips.scss b/apps/red-ui/src/assets/styles/red-tooltips.scss
index 28478b118..d3aa5926c 100644
--- a/apps/red-ui/src/assets/styles/red-tooltips.scss
+++ b/apps/red-ui/src/assets/styles/red-tooltips.scss
@@ -26,7 +26,7 @@
     }
 
     &.small {
-        max-width: 180px;
+        max-width: 160px;
     }
 
     &.warn {