From e26c6fa2560b3a7a1b6d3032544fc30a0e587aa3 Mon Sep 17 00:00:00 2001
From: diondiondion <mail@diondiondion.com>
Date: Fri, 27 Mar 2026 11:12:41 +0100
Subject: [PATCH] Fix styling regressions: familiar followers layout & alert
 action hover color (#38438)

---
 .../mastodon/components/edited_timestamp/index.tsx        | 1 +
 .../account_timeline/components/familiar_followers.tsx    | 4 +++-
 app/javascript/styles/mastodon/components.scss            | 8 ++++++--
 3 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/app/javascript/mastodon/components/edited_timestamp/index.tsx b/app/javascript/mastodon/components/edited_timestamp/index.tsx
index eb07559cb2..2d73904dff 100644
--- a/app/javascript/mastodon/components/edited_timestamp/index.tsx
+++ b/app/javascript/mastodon/components/edited_timestamp/index.tsx
@@ -121,6 +121,7 @@ export const EditedTimestamp: React.FC<{
               />
             ),
           }}
+          tagName='span'
         />
       </button>
     </Dropdown>
diff --git a/app/javascript/mastodon/features/account_timeline/components/familiar_followers.tsx b/app/javascript/mastodon/features/account_timeline/components/familiar_followers.tsx
index cc6434c6ee..248a182d27 100644
--- a/app/javascript/mastodon/features/account_timeline/components/familiar_followers.tsx
+++ b/app/javascript/mastodon/features/account_timeline/components/familiar_followers.tsx
@@ -69,7 +69,9 @@ export const FamiliarFollowers: React.FC<{ accountId: string }> = ({
           <Avatar withLink key={account.id} account={account} size={28} />
         ))}
       </AvatarGroup>
-      <FamiliarFollowersReadout familiarFollowers={familiarFollowers} />
+      <span>
+        <FamiliarFollowersReadout familiarFollowers={familiarFollowers} />
+      </span>
     </div>
   );
 };
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index c6870f1fb8..f1438c9490 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -10400,9 +10400,13 @@ noscript {
   padding: 0 4px;
 
   &:hover,
-  &:focus,
   &:active {
-    background: var(--color-bg-brand-softest);
+    background: rgb(from var(--color-text-inverted) r g b / 10%);
+  }
+
+  &:focus-visible {
+    outline: 2px solid var(--color-text-brand-on-inverted);
+    outline-offset: 2px;
   }
 }