mirror of
https://github.com/wukko/cobalt.git
synced 2024-11-15 12:50:01 +00:00
web/PickerItem: add support for gifs in picker
This commit is contained in:
parent
e0bc0553ca
commit
7427788efd
3 changed files with 7 additions and 3 deletions
|
@ -1,4 +1,5 @@
|
|||
{
|
||||
"picker.item.photo": "photo thumbnail",
|
||||
"picker.item.video": "video thumbnail"
|
||||
"picker.item.video": "video thumbnail",
|
||||
"picker.item.gif": "gif thumbnail"
|
||||
}
|
||||
|
|
|
@ -8,6 +8,7 @@
|
|||
|
||||
import IconMovie from "@tabler/icons-svelte/IconMovie.svelte";
|
||||
import IconPhoto from "@tabler/icons-svelte/IconPhoto.svelte";
|
||||
import IconGif from "@tabler/icons-svelte/IconGif.svelte";
|
||||
|
||||
export let item: DialogPickerItem;
|
||||
export let number: number;
|
||||
|
@ -21,6 +22,8 @@
|
|||
<div class="picker-type">
|
||||
{#if itemType === "video"}
|
||||
<IconMovie />
|
||||
{:else if itemType === "gif"}
|
||||
<IconGif />
|
||||
{:else}
|
||||
<IconPhoto />
|
||||
{/if}
|
||||
|
@ -31,7 +34,7 @@
|
|||
src={item.thumb ?? item.url}
|
||||
|
||||
class:loading={!imageLoaded}
|
||||
class:video-thumbnail={itemType === "video"}
|
||||
class:video-thumbnail={["video", "gif"].includes(itemType)}
|
||||
on:load={() => imageLoaded = true}
|
||||
|
||||
alt="{$t(`a11y.dialog.picker.item.${itemType}`)} {number}"
|
||||
|
|
|
@ -10,7 +10,7 @@ export type DialogButton = {
|
|||
export type SmallDialogIcons = "warn-red";
|
||||
|
||||
export type DialogPickerItem = {
|
||||
type?: 'photo' | 'video',
|
||||
type?: 'photo' | 'video' | 'gif',
|
||||
url: string,
|
||||
thumb?: string,
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue