PlayResults page UI updates

TaikoWebUI/Pages/PlayResults.razor

@@ -32,9 +32,21 @@ else
                         <MudText Typo="Typo.caption">@GameDataService.GetMusicArtistBySongId(context.Item.SongId)</MudText>
                     </CellTemplate>
                 </Column>
-                <Column T="SongBestData" Field="@nameof(SongBestData.Difficulty)" Title="Difficulty"/>
+                <Column T="SongBestData" Field="@nameof(SongBestData.Difficulty)" Title="Difficulty">
+                    <CellTemplate>
+                            <MudTooltip Text="@(context.Item.Difficulty.ToString())" Arrow="true" Placement="Placement.Top">
+                                <img src="@($"/images/{context.Item.Difficulty}.png")" alt="@(context.Item.Difficulty)" style="@(iconStyle)" />
+                        </MudTooltip>
+                    </CellTemplate>
+                </Column>
                 <Column T="SongBestData" Field="@nameof(SongBestData.BestScore)" Title="Best Score"/>
-                <Column T="SongBestData" Field="@nameof(SongBestData.BestCrown)" Title="Best Crown"/>
+                <Column T="SongBestData" Field="@nameof(SongBestData.BestCrown)" Title="Best Crown" >
+                    <CellTemplate>
+                            <MudTooltip Text="@(getCrownText(context.Item.BestCrown.ToString()))" Arrow="true" Placement="Placement.Top">
+                                <img src="@($"/images/crown_{context.Item.BestCrown}.png")" alt="@(context.Item.BestCrown)" style="@(iconStyle)" />
+                        </MudTooltip>
+                    </CellTemplate>
+                </Column>
                 <Column T="SongBestData" Field="@nameof(SongBestData.BestScoreRank)" Title="Best Rank" />
                 <Column T="SongBestData" Field="@nameof(SongBestData.BestRate)" Title="Best Rate"/>
                 <Column T="SongBestData" Field="@nameof(SongBestData.IsFavorite)" Title="Favorite">
@@ -64,6 +76,8 @@ else
 
     private SongBestResponse? response;
 
+    private String iconStyle = "width:25px; height:25px;";
+
     private List<BreadcrumbItem> breadcrumbs = new()
     {
         new BreadcrumbItem("Cards", href: "/Cards"),
@@ -93,4 +107,16 @@ else
         }
     }
 
+    private string getCrownText(String crown)
+    {
+        return crown switch
+        {
+            "None" => "Fail",
+            "Clear" => "Cleared",
+            "Gold" => "Full Combo",
+            "Dondaful" => "Donderful Combo",
+            _ => ""
+        };
+    }
+
 }