midgard/mapcomplete
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

UX: remove trapFocus as it causes bugs

Browse source
This commit is contained in:
Pieter Vander Vennet 2024-06-16 13:09:13 +02:00
parent 72d10863b8
commit 19c57ffce0
4 changed files with 2 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "mapcomplete", "name": "mapcomplete",
"version": "0.43.1", "version": "0.43.2",
"repository": "https://github.com/pietervdvn/MapComplete", "repository": "https://github.com/pietervdvn/MapComplete",
"description": "A small website to edit OSM easily", "description": "A small website to edit OSM easily",
"bugs": "https://github.com/pietervdvn/MapComplete/issues", "bugs": "https://github.com/pietervdvn/MapComplete/issues",
@ -194,7 +194,6 @@
"svg-path-parser": "^1.1.0", "svg-path-parser": "^1.1.0",
"tailwind-merge": "^1.13.1", "tailwind-merge": "^1.13.1",
"tailwindcss": "^3.1.8", "tailwindcss": "^3.1.8",
"trap-focus-svelte": "^1.0.2",
"turndown": "^7.1.3", "turndown": "^7.1.3",
"vite-node": "^0.28.3", "vite-node": "^0.28.3",
"vitest": "^0.28.3", "vitest": "^0.28.3",

3
src/UI/Base/FloatOver.svelte
View file

@ -1,8 +1,6 @@
<script lang="ts"> <script lang="ts">
import { createEventDispatcher } from "svelte" import { createEventDispatcher } from "svelte"
import { XCircleIcon } from "@rgossiaux/svelte-heroicons/solid" import { XCircleIcon } from "@rgossiaux/svelte-heroicons/solid"
import { twMerge } from "tailwind-merge"
import { trapFocus } from "trap-focus-svelte"
import { ariaLabel } from "../../Utils/ariaLabel" import { ariaLabel } from "../../Utils/ariaLabel"
import Translations from "../i18n/Translations" import Translations from "../i18n/Translations"
@ -25,7 +23,6 @@
<div <div
class={"absolute bottom-0 right-0 h-full w-screen p-4 md:p-6"} class={"absolute bottom-0 right-0 h-full w-screen p-4 md:p-6"}
style="z-index: 21" style="z-index: 21"
use:trapFocus
> >
<div class="content normal-background h-full" on:click|stopPropagation={() => {}}> <div class="content normal-background h-full" on:click|stopPropagation={() => {}}>
<div class="h-full rounded-xl"> <div class="h-full rounded-xl">

2
src/UI/Base/ModalRight.svelte
View file

@ -1,7 +1,6 @@
<script lang="ts"> <script lang="ts">
import { createEventDispatcher } from "svelte" import { createEventDispatcher } from "svelte"
import { XCircleIcon } from "@rgossiaux/svelte-heroicons/solid" import { XCircleIcon } from "@rgossiaux/svelte-heroicons/solid"
import { trapFocus } from "trap-focus-svelte"
/** /**
* The slotted element will be shown on the right side * The slotted element will be shown on the right side
@ -17,7 +16,6 @@
style="max-width: 100vw; max-height: 100vh" style="max-width: 100vw; max-height: 100vh"
tabindex="-1" tabindex="-1"
id="modal-right" id="modal-right"
use:trapFocus
> >
<slot name="close-button"> <slot name="close-button">
<button <button

2
src/UI/ThemeViewGUI.svelte
View file

@ -452,7 +452,7 @@
{/if} {/if}
<If condition={state.previewedImage.map((i) => i !== undefined)}> <If condition={state.previewedImage.map((i) => i !== undefined)}>
<FloatOver extraClasses="p-1" on:close={() => state.previewedImage.setData(undefined)}> <FloatOver on:close={() => state.previewedImage.setData(undefined)}>
<button <button
class="absolute right-4 top-4 h-8 w-8 rounded-full p-0" class="absolute right-4 top-4 h-8 w-8 rounded-full p-0"
on:click={() => previewedImage.setData(undefined)} on:click={() => previewedImage.setData(undefined)}