Profile: supports bot mark

This commit is contained in:
thislight 2024-11-05 16:19:55 +08:00
parent 456cfdfbb0
commit bda41f0923
No known key found for this signature in database
GPG key ID: FCFE5192241CCD4E
2 changed files with 26 additions and 8 deletions

View file

@ -38,6 +38,16 @@
flex-flow: column nowrap; flex-flow: column nowrap;
} }
.bot-mark {
font-size: 1.2em;
}
.display-name {
display: flex;
align-items: center;
gap: 4px;
}
table.acct-fields { table.acct-fields {
word-break: break-all; word-break: break-all;

View file

@ -38,10 +38,12 @@ import {
PlaylistAdd, PlaylistAdd,
Send, Send,
Share, Share,
SmartToy,
SmartToySharp,
Translate, Translate,
Verified, Verified,
} from "@suid/icons-material"; } from "@suid/icons-material";
import { Title } from "../material/typography"; import { Body2, Title } from "../material/typography";
import { useNavigate, useParams } from "@solidjs/router"; import { useNavigate, useParams } from "@solidjs/router";
import { useSessionForAcctStr } from "../masto/clients"; import { useSessionForAcctStr } from "../masto/clients";
import { resolveCustomEmoji } from "../masto/toot"; import { resolveCustomEmoji } from "../masto/toot";
@ -400,15 +402,21 @@ const Profile: Component = () => {
}} }}
></Avatar> ></Avatar>
<div class="name-grp"> <div class="name-grp">
<span <div class="display-name">
ref={(e) => <Show when={profile()?.bot}>
<SmartToySharp class="bot-mark" aria-label="Bot" />
</Show>
<Body2
component="span"
ref={(e: HTMLElement) =>
createRenderEffect(() => (e.innerHTML = displayName())) createRenderEffect(() => (e.innerHTML = displayName()))
} }
aria-label="Display name" aria-label="Display name"
></span> ></Body2>
</div>
<span aria-label="Complete username">{fullUsername()}</span> <span aria-label="Complete username">{fullUsername()}</span>
</div> </div>
<div> <div role="presentation">
<Switch> <Switch>
<Match <Match
when={ when={