Fix broken thumbnail images not taking up appropriate size on ff (#2486)

Closes #2485 

Also adds alt text to collection thumbnail images.
This commit is contained in:
Emma Segal-Grossman 2025-03-18 18:53:10 -04:00 committed by GitHub
parent bcb73932d4
commit 89a6e84377
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 9 additions and 2 deletions

View File

@ -1,4 +1,4 @@
import { localized } from "@lit/localize";
import { localized, msg, str } from "@lit/localize";
import { html } from "lit";
import { customElement, property } from "lit/decorators.js";
@ -38,10 +38,16 @@ export class CollectionThumbnail extends BtrixElement {
@property({ type: String })
src?: string;
@property({ type: String })
collectionName?: string;
render() {
return html`
<img
class="aspect-video rounded-lg bg-slate-50 object-cover"
class="aspect-video size-full rounded-lg bg-slate-50 object-cover"
alt=${this.collectionName
? msg(str`Thumbnail image for “${this.collectionName}” collection`)
: msg("Thumbnail image")}
src=${this.src || DEFAULT_THUMBNAIL_VARIANT.path}
/>
`;

View File

@ -101,6 +101,7 @@ export class CollectionsGrid extends BtrixElement {
([name]) => name === collection.defaultThumbnailName,
)?.[1].path || collection.thumbnail?.path,
)}
collectionName=${collection.name}
></btrix-collection-thumbnail>
${this.renderDateBadge(collection)}
</div>