helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-11-07 17:27:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix(web): avoid nesting buttons inside links (#11425)

Browse source
This commit is contained in:
Michel Heusschen 2024-07-29 16:36:10 +02:00 • committed by GitHub
parent 7bb7f63d57
commit 2e059bfbfd
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
15 changed files with 216 additions and 96 deletions
Download patch file Download diff file Expand all files Collapse all files

13
web/src/lib/components/shared-components/context-menu/button-context-menu.svelte
View file

@ -1,5 +1,8 @@
<script lang="ts">
import CircleIconButton, { type Color } from '$lib/components/elements/buttons/circle-icon-button.svelte';
import CircleIconButton, {
type Color,
type Padding,
} from '$lib/components/elements/buttons/circle-icon-button.svelte';
import ContextMenu from '$lib/components/shared-components/context-menu/context-menu.svelte';
import {
getContextMenuPositionFromBoundingRect,
@ -24,7 +27,7 @@
export let direction: 'left' | 'right' = 'right';
export let color: Color = 'transparent';
export let size: string | undefined = undefined;
export let padding: string | undefined = undefined;
export let padding: Padding | undefined = undefined;
/**
* Additional classes to apply to the button.
*/
@ -114,9 +117,9 @@
{padding}
{size}
{title}
ariaControls={menuId}
ariaExpanded={isOpen}
ariaHasPopup={true}
aria-controls={menuId}
aria-expanded={isOpen}
aria-haspopup={true}
class={buttonClass}
id={buttonId}
on:click={handleClick}

21
web/src/lib/components/shared-components/navigation-bar/account-info-panel.svelte
View file

@ -73,14 +73,19 @@
<p class="text-sm text-gray-500 dark:text-immich-dark-fg">{$user.email}</p>
</div>
<a href={AppRoute.USER_SETTINGS} on:click={() => dispatch('close')}>
<Button color="dark-gray" size="sm" shadow={false} border>
<div class="flex place-content-center place-items-center gap-2 px-2">
<Icon path={mdiCog} size="18" />
{$t('account_settings')}
</div>
</Button>
</a>
<Button
href={AppRoute.USER_SETTINGS}
on:click={() => dispatch('close')}
color="dark-gray"
size="sm"
shadow={false}
border
>
<div class="flex place-content-center place-items-center gap-2 px-2">
<Icon path={mdiCog} size="18" />
{$t('account_settings')}
</div>
</Button>
</div>
<div class="mb-4 flex flex-col">

10
web/src/lib/components/shared-components/navigation-bar/navigation-bar.svelte
View file

@ -60,9 +60,13 @@
<section class="flex place-items-center justify-end gap-4 max-sm:w-full">
{#if $featureFlags.search}
<a href={AppRoute.SEARCH} id="search-button" class="ml-4 sm:hidden">
<CircleIconButton title={$t('go_to_search')} icon={mdiMagnify} />
</a>
<CircleIconButton
href={AppRoute.SEARCH}
id="search-button"
class="ml-4 sm:hidden"
title={$t('go_to_search')}
icon={mdiMagnify}
/>
{/if}
<ThemeButton />

4
web/src/lib/components/shared-components/purchasing/individual-purchase-option-card.svelte
View file

@ -37,8 +37,6 @@
</div>
</div>
<a href={getProductLink(ImmichProduct.Client)}>
<Button fullwidth>{$t('purchase_button_select')}</Button>
</a>
<Button href={getProductLink(ImmichProduct.Client)} fullwidth>{$t('purchase_button_select')}</Button>
</div>
</div>

4
web/src/lib/components/shared-components/purchasing/server-purchase-option-card.svelte
View file

@ -37,8 +37,6 @@
</div>
</div>
<a href={getLicenseLink(ImmichProduct.Server)}>
<Button fullwidth>{$t('purchase_button_select')}</Button>
</a>
<Button href={getLicenseLink(ImmichProduct.Server)} fullwidth>{$t('purchase_button_select')}</Button>
</div>
</div>