Cutlery/immich
1
0
Fork 1
mirror of https://github.com/immich-app/immich.git synced 2025-06-01 12:44:17 -04:00
Code Issues Packages Projects Releases Wiki Activity

feat(web): Left hand navigation with A/D (#11907)

Browse Source
This commit is contained in:
Carles Albàs Boix 2024-08-19 19:07:18 +02:00 committed by GitHub
parent bc31b7c06c
commit ca52cbace1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 14 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
web/src/lib/components/asset-viewer/actions/next-asset-action.svelte
View File

@ -1,5 +1,5 @@
<script lang="ts"> <script lang="ts">
import { shortcut } from '$lib/actions/shortcut'; import { shortcuts } from '$lib/actions/shortcut';
import Icon from '$lib/components/elements/icon.svelte'; import Icon from '$lib/components/elements/icon.svelte';
import { mdiChevronRight } from '@mdi/js'; import { mdiChevronRight } from '@mdi/js';
import { t } from 'svelte-i18n'; import { t } from 'svelte-i18n';
@ -8,7 +8,12 @@
export let onNextAsset: () => void; export let onNextAsset: () => void;
</script> </script>
<svelte:window use:shortcut={{ shortcut: { key: 'ArrowRight' }, onShortcut: onNextAsset }} /> <svelte:window
use:shortcuts={[
{ shortcut: { key: 'ArrowRight' }, onShortcut: onNextAsset },
{ shortcut: { key: 'd' }, onShortcut: onNextAsset },
]}
/>
<NavigationArea onClick={onNextAsset} label={$t('view_next_asset')}> <NavigationArea onClick={onNextAsset} label={$t('view_next_asset')}>
<Icon path={mdiChevronRight} size="36" ariaHidden /> <Icon path={mdiChevronRight} size="36" ariaHidden />

9
web/src/lib/components/asset-viewer/actions/previous-asset-action.svelte
View File

@ -1,5 +1,5 @@
<script lang="ts"> <script lang="ts">
import { shortcut } from '$lib/actions/shortcut'; import { shortcuts } from '$lib/actions/shortcut';
import Icon from '$lib/components/elements/icon.svelte'; import Icon from '$lib/components/elements/icon.svelte';
import { mdiChevronLeft } from '@mdi/js'; import { mdiChevronLeft } from '@mdi/js';
import { t } from 'svelte-i18n'; import { t } from 'svelte-i18n';
@ -8,7 +8,12 @@
export let onPreviousAsset: () => void; export let onPreviousAsset: () => void;
</script> </script>
<svelte:window use:shortcut={{ shortcut: { key: 'ArrowLeft' }, onShortcut: onPreviousAsset }} /> <svelte:window
use:shortcuts={[
{ shortcut: { key: 'ArrowLeft' }, onShortcut: onPreviousAsset },
{ shortcut: { key: 'a' }, onShortcut: onPreviousAsset },
]}
/>
<NavigationArea onClick={onPreviousAsset} label={$t('view_previous_asset')}> <NavigationArea onClick={onPreviousAsset} label={$t('view_previous_asset')}>
<Icon path={mdiChevronLeft} size="36" ariaHidden /> <Icon path={mdiChevronLeft} size="36" ariaHidden />