From 6c1a4b5119c9eda4c4b4e8817ea5f6fecee4f59c Mon Sep 17 00:00:00 2001
From: pancakes <trypancakes@tutanota.com>
Date: Sat, 8 Mar 2025 14:37:49 +1000
Subject: [PATCH] [frontend/components] Make host part of usernames dim like in
 reactions

---
 Iceshrimp.Frontend/Components/Note/NoteUserInfo.razor     | 6 +++++-
 Iceshrimp.Frontend/Components/Note/NoteUserInfo.razor.css | 4 ++++
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/Iceshrimp.Frontend/Components/Note/NoteUserInfo.razor b/Iceshrimp.Frontend/Components/Note/NoteUserInfo.razor
index 3a90e6fe..4857ae6a 100644
--- a/Iceshrimp.Frontend/Components/Note/NoteUserInfo.razor
+++ b/Iceshrimp.Frontend/Components/Note/NoteUserInfo.razor
@@ -9,7 +9,11 @@
 <div class="name-section">
     <span class="display-name"><UserDisplayName User="@User"/></span>
     <span class="identifier">
-        @@@User.Username@(User.Host != null ? $"@{User.Host}" : "")
+        @@@User.Username
+        @if (User.Host != null)
+        {
+            <span class="host">@@@User.Host</span>
+        }
         @if (User.IsBot)
         {
             <Icon Name="Icons.Robot" Size="1.3em" title="Automated"/>
diff --git a/Iceshrimp.Frontend/Components/Note/NoteUserInfo.razor.css b/Iceshrimp.Frontend/Components/Note/NoteUserInfo.razor.css
index a0320b13..04961d71 100644
--- a/Iceshrimp.Frontend/Components/Note/NoteUserInfo.razor.css
+++ b/Iceshrimp.Frontend/Components/Note/NoteUserInfo.razor.css
@@ -7,6 +7,10 @@
         font-size: 0.8em;
         text-overflow: ellipsis;
         overflow: clip;
+
+        .host {
+            opacity: 0.5;
+        }
     }
     min-width: 2rem;
     overflow: clip;