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

More styling

Browse source
This commit is contained in:
Pieter Vander Vennet 2024-06-17 04:27:08 +02:00
parent 6a67b9f2f2
commit 08ab5a58fb
38 changed files with 474 additions and 493 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -79,7 +79,8 @@
}}
>
<label
class={twMerge(cls, drawAttention ? "glowing-shadow" : "")}
class:focus={drawAttention}
class={cls}
for={id}
on:click|preventDefault={() => {
inputElement.click()

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

@ -14,13 +14,16 @@
<div
class="absolute top-0 left-0 h-screen w-screen"
on:click={() => {
console.log("OnClose")
dispatch("close")
}}
style="background-color: #00000088; z-index: 20"
/>
<!-- draw a _second_ absolute div, placed using 'bottom' which will be above the navigation bar on mobile browsers -->
<div class={"absolute bottom-0 right-0 h-full w-screen p-4 md:p-6"} style="z-index: 21">
<div class="content normal-background h-full" on:click|stopPropagation={() => {}}>
<div class="absolute bottom-0 right-0 h-full w-screen p-4 md:p-6 pointer-events-none" style="z-index: 21" on:click={() =>{
console.log("Closing...")
dispatch("close")}}>
<div class="content normal-background h-full pointer-events-auto" on:click|stopPropagation={() => {}}>
<div class="h-full rounded-xl">
<slot />
</div>

4
src/UI/Base/LoginButton.svelte
View file

@ -3,6 +3,8 @@
import Translations from "../i18n/Translations.js"
import Tr from "./Tr.svelte"
import Login from "../../assets/svg/Login.svelte"
import ArrowRightOnRectangle from "@babeard/svelte-heroicons/solid/ArrowRightOnRectangle"
import ArrowLeftOnRectangle from "@babeard/svelte-heroicons/solid/ArrowLeftOnRectangle"
export let osmConnection: OsmConnection
export let clss: string | undefined = undefined
@ -13,7 +15,7 @@
</script>
<button class={clss} on:click={() => osmConnection.AttemptLogin()} style="margin-left: 0">
<Login class="m-1 w-12" />
<ArrowLeftOnRectangle class="m-1 w-12" />
<slot>
<Tr t={Translations.t.general.loginWithOpenStreetMap} />
</slot>

4
src/UI/Base/LogoutButton.svelte
View file

@ -3,15 +3,17 @@
import Logout from "../../assets/svg/Logout.svelte"
import Translations from "../i18n/Translations"
import Tr from "./Tr.svelte"
import ArrowRightOnRectangle from "@babeard/svelte-heroicons/solid/ArrowRightOnRectangle"
export let osmConnection: OsmConnection
</script>
<button
class="as-link"
on:click={() => {
osmConnection.LogOut()
}}
>
<Logout class="h-6 w-6" />
<ArrowRightOnRectangle class="h-6 w-6" />
<Tr t={Translations.t.general.logout} />
</button>