Mirrors/cobalt
1
0
Fork 0
mirror of https://github.com/wukko/cobalt.git synced 2024-11-15 04:39:58 +00:00
Code Issues Projects Releases Packages Wiki Activity

web/PickerItem: add support for gifs in picker

Browse source
This commit is contained in:
wukko 2024-07-26 21:34:18 +06:00
parent e0bc0553ca
commit 7427788efd
No known key found for this signature in database
GPG key ID: 3E30B3F26C7B4AA2
3 changed files with 7 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
web/i18n/en/a11y/dialog.json
View file

@ -1,4 +1,5 @@
{
"picker.item.photo": "photo thumbnail",
"picker.item.video": "video thumbnail"
"picker.item.video": "video thumbnail",
"picker.item.gif": "gif thumbnail"
}

5
web/src/components/dialog/PickerItem.svelte
View file

@ -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}"

2
web/src/lib/types/dialog.ts
View file

@ -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,
}