From 1f8bd653b298703afe2662c05e1009ca80994849 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Samuel=20Rinnetm=C3=A4ki?= <samuel@iki.fi>
Date: Mon, 15 Apr 2024 17:31:30 -0700
Subject: [PATCH] titles to tooltips, transparent padding for logo

---
 .../src/app/wallets-show/wallets-show.component.html   | 10 +++++-----
 .../src/app/wallets-show/wallets-show.component.scss   |  5 +++--
 viewer/src/app/wallets-show/wallets-show.component.ts  |  2 ++
 3 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/viewer/src/app/wallets-show/wallets-show.component.html b/viewer/src/app/wallets-show/wallets-show.component.html
index 79deed1..f5e5ba5 100644
--- a/viewer/src/app/wallets-show/wallets-show.component.html
+++ b/viewer/src/app/wallets-show/wallets-show.component.html
@@ -58,23 +58,23 @@ <h1>{{ wallet.name }}</h1>
   <mat-divider></mat-divider>
   <div fxLayout="row" fxLayoutAlign="space-between start">
     <mat-list>
-      <mat-list-item title="{{walletsService.getTooltip('type')}}">
+      <mat-list-item [matTooltip]="walletsService.getTooltip('type')">
         <div matListItemTitle><b>Type</b></div>
         <span matListItemLine>{{ wallet.type }}</span>
       </mat-list-item>
-      <mat-list-item title="{{walletsService.getTooltip('capability')}}">
+      <mat-list-item [matTooltip]="walletsService.getTooltip('capability')">
         <div matListItemTitle><b>Capabilities</b></div>
         <span matListItemLine>{{
           wallet.capability?.join(', ')
         }}</span>
       </mat-list-item>
-      <mat-list-item title="{{walletsService.getTooltip('portability')}}">
+      <mat-list-item [matTooltip]="walletsService.getTooltip('portability')">
         <div matListItemTitle><b>Portability</b></div>
         <span matListItemLine>{{ wallet.portability ?? 'unknown' }}</span>
       </mat-list-item>
     </mat-list>
     <mat-list>
-      <mat-list-item title="{{walletsService.getTooltip('openSource')}}">
+      <mat-list-item [matTooltip]="walletsService.getTooltip('openSource')">
         <div matListItemTitle><b>Open Source</b></div>
         <span matListItemLine *ngIf="!wallet.downloadSource"
           >{{ wallet.openSource }}
@@ -87,7 +87,7 @@ <h1>{{ wallet.name }}</h1>
         >
       </mat-list-item>
       <mat-list-item>
-        <div matListItemTitle title="{{walletsService.getTooltip('license')}}"><b>License</b></div>
+        <div matListItemTitle [matTooltip]="walletsService.getTooltip('license')"><b>License</b></div>
         <span matListItemLine>{{ wallet.license ?? 'unknown' }}</span>
       </mat-list-item>
     </mat-list>
diff --git a/viewer/src/app/wallets-show/wallets-show.component.scss b/viewer/src/app/wallets-show/wallets-show.component.scss
index 54012c1..a1afe38 100644
--- a/viewer/src/app/wallets-show/wallets-show.component.scss
+++ b/viewer/src/app/wallets-show/wallets-show.component.scss
@@ -24,11 +24,12 @@ a:hover {
 }
 
 .logo {
-  max-height: 200px;
-  max-width: 50%;
+  background-color: transparent;
   border-radius: 20px;
   // make a shadow for the box
   box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
+  max-height: 200px;
+  max-width: 50%;
   padding: 10px;
 }
 
diff --git a/viewer/src/app/wallets-show/wallets-show.component.ts b/viewer/src/app/wallets-show/wallets-show.component.ts
index eece575..60d7c93 100644
--- a/viewer/src/app/wallets-show/wallets-show.component.ts
+++ b/viewer/src/app/wallets-show/wallets-show.component.ts
@@ -9,6 +9,7 @@ import { FlexLayoutModule } from '@ngbracket/ngx-layout';
 import { MatIconModule } from '@angular/material/icon';
 import { MatButtonModule } from '@angular/material/button';
 import { MatListModule } from '@angular/material/list';
+import { MatTooltipModule } from '@angular/material/tooltip';
 
 @Component({
   selector: 'app-wallets-show',
@@ -22,6 +23,7 @@ import { MatListModule } from '@angular/material/list';
     FlexLayoutModule,
     MatIconModule,
     MatListModule,
+    MatTooltipModule,
   ],
   providers: [WalletsService],
   templateUrl: './wallets-show.component.html',