Show performer image in select (#4227)

This commit is contained in:
WithoutPants 2023-10-26 15:01:49 +11:00 committed by GitHub
parent c4d7a7ab2c
commit 552f86586a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 24 additions and 3 deletions

View file

@ -40,4 +40,5 @@ fragment SelectPerformerData on Performer {
name
disambiguation
alias_list
image_path
}

View file

@ -34,7 +34,7 @@ export type SelectObject = {
export type Performer = Pick<
GQL.Performer,
"id" | "name" | "alias_list" | "disambiguation"
"id" | "name" | "alias_list" | "disambiguation" | "image_path"
>;
type Option = SelectOption<Performer>;
@ -86,6 +86,18 @@ export const PerformerSelect: React.FC<
...optionProps,
children: (
<span>
<a
href={`/performers/${object.id}`}
target="_blank"
rel="noreferrer"
className="performer-select-image-link"
>
<img
className="performer-select-image"
src={object.image_path ?? ""}
loading="lazy"
/>
</a>
<span>{name}</span>
{object.disambiguation && (
<span className="performer-disambiguation">{` (${object.disambiguation})`}</span>

View file

@ -221,6 +221,14 @@
}
}
.performer-select .alias {
.performer-select {
.alias {
font-weight: bold;
}
.performer-select-image {
margin-right: 0.5em;
max-height: 50px;
max-width: 50px;
}
}