move search result tooltips to the left of results

https://ucsc-cgl.atlassian.net/browse/SEAB-5971
dockstore · Dec 6, 2023 · 56236cb · 56236cb
1 parent ed55167
commit 56236cb
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 12 deletions.
diff --git a/src/app/search/search-tool-table/search-tool-table.component.html b/src/app/search/search-tool-table/search-tool-table.component.html
@@ -27,16 +27,29 @@
             <app-private-icon></app-private-icon>
           </span>
           <div *ngIf="tool.source | isAppTool; else docktoreToolName">
-            <a [matTooltip]="tool?.source.full_workflow_path" [routerLink]="'/containers/' + tool.source.full_workflow_path">{{
-              tool?.source.organization + '/' + tool?.source.repository + (tool?.source.workflowName ? '/' + tool?.source.workflowName : '')
-            }}</a>
+            <a
+              [matTooltip]="tool?.source.full_workflow_path"
+              matTooltipPosition="left"
+              [routerLink]="'/containers/' + tool.source.full_workflow_path"
+              >{{
+                tool?.source.organization +
+                  '/' +
+                  tool?.source.repository +
+                  (tool?.source.workflowName ? '/' + tool?.source.workflowName : '')
+              }}</a
+            >
           </div>
           <ng-template #docktoreToolName>
-            <a [matTooltip]="tool?.source.tool_path" [routerLink]="'/containers/' + tool.source.tool_path">{{
+            <a [matTooltip]="tool?.source.tool_path" matTooltipPosition="left" [routerLink]="'/containers/' + tool.source.tool_path">{{
               tool?.source.namespace + '/' + tool?.source.name + (tool?.source.toolname ? '/' + tool?.source.toolname : '')
             }}</a>
           </ng-template>
-          <div class="truncate-text-2 size-small" *ngIf="tool.source.topicAutomatic" [matTooltip]="tool.source.topicAutomatic">
+          <div
+            class="truncate-text-2 size-small"
+            *ngIf="tool.source.topicAutomatic"
+            [matTooltip]="tool.source.topicAutomatic"
+            matTooltipPosition="left"
+          >
             {{ tool.source.topicAutomatic }}
           </div>
         </div>

diff --git a/src/app/search/search-workflow-table/search-workflow-table.component.html b/src/app/search/search-workflow-table/search-workflow-table.component.html
@@ -7,13 +7,23 @@
       <mat-header-cell *matHeaderCellDef mat-sort-header>Name and Description</mat-header-cell>
       <mat-cell data-cy="workflowColumn" *matCellDef="let workflow">
         <div>
-          <a [matTooltip]="workflow?.source.full_workflow_path" [routerLink]="'/workflows/' + workflow?.source.full_workflow_path">{{
-            workflow?.source.organization +
-              '/' +
-              workflow?.source.repository +
-              (workflow?.source.workflowName ? '/' + workflow?.source.workflowName : '')
-          }}</a>
-          <div class="truncate-text-2 size-small" *ngIf="workflow.source.topicAutomatic" [matTooltip]="workflow.source.topicAutomatic">
+          <a
+            [matTooltip]="workflow?.source.full_workflow_path"
+            matTooltipPosition="left"
+            [routerLink]="'/workflows/' + workflow?.source.full_workflow_path"
+            >{{
+              workflow?.source.organization +
+                '/' +
+                workflow?.source.repository +
+                (workflow?.source.workflowName ? '/' + workflow?.source.workflowName : '')
+            }}</a
+          >
+          <div
+            class="truncate-text-2 size-small"
+            *ngIf="workflow.source.topicAutomatic"
+            [matTooltip]="workflow.source.topicAutomatic"
+            matTooltipPosition="left"
+          >
             {{ workflow.source.topicAutomatic }}
           </div>
         </div>