ilja_space/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

UX: move confirm for OH button below popup, fix Z-index

Browse source
This commit is contained in:
Pieter Vander Vennet 2025-06-07 14:37:50 +02:00
parent 89ba8ce2c1
commit 66d455a475
2 changed files with 10 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

5
src/UI/BigComponents/WelcomeBack.svelte
View file

@ -1,8 +1,7 @@
<script lang="ts">
import { Avatar, Popover } from "flowbite-svelte"
import { Popover } from "flowbite-svelte"
import { fade } from "svelte/transition"
import Tr from "../Base/Tr.svelte"
import { OsmConnection } from "../../Logic/Osm/OsmConnection"
let open = false
@ -20,7 +19,7 @@
</script>
<Popover class="mt-4" defaultClass="py-2 px-3 w-fit " trigger=null placement="bottom"
<Popover class="mt-4 z-50" defaultClass="py-2 px-3 w-fit " trigger=null placement="bottom"
transition={e => fade(e, {duration: 150})} bind:open>
{#if $userdetails !== undefined}
<div style="width: max-content" class="flex items-center">

13
src/UI/InputElement/Helpers/OpeningHoursInput.svelte
View file

@ -7,6 +7,8 @@
import OHTable from "./OpeningHours/OHTable.svelte"
import OpeningHoursState from "../../OpeningHours/OpeningHoursState"
import Popup from "../../Base/Popup.svelte"
import Tr from "../../Base/Tr.svelte"
import Translations from "../../i18n/Translations"
import Check from "@babeard/svelte-heroicons/mini/Check"
export let value: UIEventSource<string>
@ -29,17 +31,18 @@
const state = new OpeningHoursState(value, prefix, postfix)
let expanded = new UIEventSource(false)
</script>
<Popup bodyPadding="p-0" shown={expanded}>
<OHTable value={state.normalOhs} />
<button
on:click={() => expanded.set(false)}
class="primary pointer-events-auto absolute bottom-0 left-0 h-8 w-10 rounded-full"
>
<div class="absolute w-full flex justify-center" style="bottom: -3rem">
<button class=" primary " on:click={() => expanded.set(false)}>
<Check class="m-0 h-6 w-6 shrink-0 p-0" color="white" />
<Tr t={Translations.t.general.confirm}/>
</button>
</div>
</Popup>
<button on:click={() => expanded.set(true)}>Pick opening hours</button>
<button on:click={() => expanded.set(true)}>Pick opening hours</button>
<PublicHolidaySelector value={state.phSelectorValue} />