1
0
Fork 0
mirror of https://github.com/seanmorley15/AdventureLog.git synced 2025-07-23 23:09:37 +02:00
AdventureLog/frontend/src/lib/components/AboutModal.svelte
2024-09-06 19:06:24 -04:00

76 lines
2.2 KiB
Svelte

<script lang="ts">
import { createEventDispatcher } from 'svelte';
const dispatch = createEventDispatcher();
import { onMount } from 'svelte';
let modal: HTMLDialogElement;
import { appVersion, copyrightYear, versionChangelog } from '$lib/config';
onMount(() => {
modal = document.getElementById('my_modal_1') as HTMLDialogElement;
if (modal) {
modal.showModal();
}
});
function close() {
dispatch('close');
}
function handleKeydown(event: KeyboardEvent) {
if (event.key === 'Escape') {
dispatch('close');
}
}
</script>
<dialog id="my_modal_1" class="modal">
<!-- svelte-ignore a11y-no-noninteractive-element-interactions -->
<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
<div class="modal-box" role="dialog" on:keydown={handleKeydown} tabindex="0">
<h3 class="font-bold text-lg">
About AdventureLog<span class=" inline-block"
><img src="/favicon.png" alt="Map Logo" class="w-10 -mb-3 ml-2" /></span
>
</h3>
<p class="py-1">
AdventureLog <a
target="_blank"
rel="noopener noreferrer"
class="text-primary-500 underline"
href={versionChangelog}>{appVersion}</a
>
</p>
<p class="py-1">
© {copyrightYear}
<a
href="https://github.com/seanmorley15"
target="_blank"
rel="noopener noreferrer"
class="text-primary-500 underline">Sean Morley</a
>
</p>
<p class="py-1">Licensed under the GPL-3.0 License.</p>
<p class="py-1">
<a
href="https://github.com/seanmorley15/AdventureLog"
target="_blank"
rel="noopener noreferrer"
class="text-primary-500 underline">Source Code</a
>
</p>
<p class="py-1">Made with ❤️ in the United States.</p>
<div class="divider"></div>
<h3 class="font-bold text-md">Open Source Attributions</h3>
<p class="py-1 mb-4">
Location Search and Geocoding is provided by <a
target="_blank"
rel="noopener noreferrer"
class="text-primary-500 underline"
href="https://operations.osmfoundation.org/policies/nominatim/">OpenStreepMap</a
>. Their data is liscensed under the ODbL license.
<br /> Additional attributions can be found in the README file.
</p>
<button class="btn btn-primary" on:click={close}>Close</button>
</div>
</dialog>