fix(lists): focus lost when focusing buttons (#1591)

This commit is contained in:
Joaquín Sánchez 2023-02-03 11:48:27 +01:00 committed by GitHub
parent 4b1b18768d
commit 4fc468539e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 10 additions and 6 deletions

View File

@ -36,7 +36,11 @@ async function edit() {
:to="getAccountRoute(account)"
/>
<div>
<CommonTooltip :content="isRemoved ? $t('list.add_account') : $t('list.remove_account')" :hover="isRemoved ? 'text-green' : 'text-red'">
<CommonTooltip
:content="isRemoved ? $t('list.add_account') : $t('list.remove_account')"
:hover="isRemoved ? 'text-green' : 'text-red'"
no-auto-focus
>
<button
text-sm p2 border-1 transition-colors
border-dark

View File

@ -87,13 +87,13 @@ onBeforeUnmount(() => cancelEdit(false))
</script>
<template>
<form hover:bg-active flex justify-between items-center @submit.prevent="finishEditing">
<form hover:bg-active flex justify-between items-center gap-x-2 @submit.prevent="finishEditing">
<div
v-if="isEditing"
bg-base border="~ base" h10 m2 ps-1 pe-4 rounded-3 w-full flex="~ row"
items-center relative focus-within:box-shadow-outline gap-3
>
<CommonTooltip v-if="isEditing" :content="$t('list.cancel_edit')">
<CommonTooltip v-if="isEditing" :content="$t('list.cancel_edit')" no-auto-focus>
<button
type="button"
rounded-full text-sm p2 transition-colors
@ -121,7 +121,7 @@ onBeforeUnmount(() => cancelEdit(false))
{{ list.title }}
</NuxtLink>
<div mr4 flex gap2>
<CommonTooltip v-if="isEditing" :content="$t('list.save')">
<CommonTooltip v-if="isEditing" :content="$t('list.save')" no-auto-focus>
<button
type="submit"
text-sm p2 border-1 transition-colors
@ -137,7 +137,7 @@ onBeforeUnmount(() => cancelEdit(false))
</template>
</button>
</CommonTooltip>
<CommonTooltip v-else :content="$t('list.edit')">
<CommonTooltip v-else :content="$t('list.edit')" no-auto-focus>
<button
ref="edit"
type="button"
@ -149,7 +149,7 @@ onBeforeUnmount(() => cancelEdit(false))
<span block text-current i-ri:edit-2-line class="rtl-flip" />
</button>
</CommonTooltip>
<CommonTooltip :content="$t('list.delete')">
<CommonTooltip :content="$t('list.delete')" no-auto-focus>
<button
type="button"
text-sm p2 border-1 transition-colors