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:
		
							parent
							
								
									bcb73932d4
								
							
						
					
					
						commit
						89a6e84377
					
				| @ -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} | ||||
|       /> | ||||
|     `;
 | ||||
|  | ||||
| @ -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> | ||||
|  | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user