Add donation
parent
b284c66bfc
commit
16a534e47b
|
@ -0,0 +1,45 @@
|
||||||
|
<script>
|
||||||
|
import Button from './Button.svelte';
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div class="text-white ">
|
||||||
|
<h1 class="font-semibold">Thank you! Hope you find it useful.</h1>
|
||||||
|
<p class="mt-2">
|
||||||
|
I made this website for fun when I have some spare time. Obviously will add more feature and update the data every
|
||||||
|
update, because I like to explore the game and kind of min-maxing it.
|
||||||
|
</p>
|
||||||
|
<p class="mt-1">
|
||||||
|
If you want to donate, your donation will definitely help on improving the site and motivating me to add more stuff
|
||||||
|
to Paimon.moe! Thank you very much and have fun, hope you like it!
|
||||||
|
</p>
|
||||||
|
<p class="mt-1">
|
||||||
|
You can also contributing to the project on <a
|
||||||
|
target="__blank"
|
||||||
|
class="text-primary hover:underline"
|
||||||
|
href="https://github.com/MadeBaruna/paimon-moe"
|
||||||
|
alt="github">Github</a
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
<div class="flex flex-col md:flex-row mt-2">
|
||||||
|
<a class="flex-1 mb-1 md:mb-0 md:mr-1" href="https://ko-fi.com/baruna" target="__blank">
|
||||||
|
<Button className="w-full flex-1 flex flex-col items-center">
|
||||||
|
<div class="flex h-8 mb-1 items-center">
|
||||||
|
<img class="h-6 mr-1" src="/images/donation/ko-fi.png" alt="Ko-fi" />
|
||||||
|
<img class="h-6" src="/images/donation/paypal.png" alt="PayPal" />
|
||||||
|
</div>
|
||||||
|
<span class="font-semibold">Support me on Ko-fi</span>
|
||||||
|
</Button>
|
||||||
|
</a>
|
||||||
|
<a class="flex-1 md:ml-1" href="https://trakteer.id/baruna" target="__blank">
|
||||||
|
<Button className="w-full flex flex-col items-center">
|
||||||
|
<div class="flex mb-1 items-center">
|
||||||
|
<img class="h-8 mr-1" src="/images/donation/trakteer.png" alt="Trakteer" />
|
||||||
|
<img class="h-4 mr-1" src="/images/donation/gopay.png" alt="gopay" />
|
||||||
|
<img class="h-4 mr-1" src="/images/donation/ovo.png" alt="gopay" />
|
||||||
|
<img class="h-4" src="/images/donation/dana.png" alt="gopay" />
|
||||||
|
</div>
|
||||||
|
<span class="font-semibold">Support me on Trakteer</span>
|
||||||
|
</Button>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
|
@ -1,5 +1,6 @@
|
||||||
<script>
|
<script>
|
||||||
import { fly } from 'svelte/transition';
|
import { fly } from 'svelte/transition';
|
||||||
|
import { getContext } from 'svelte';
|
||||||
import { mdiCloseCircle } from '@mdi/js';
|
import { mdiCloseCircle } from '@mdi/js';
|
||||||
|
|
||||||
import Icon from '../Icon.svelte';
|
import Icon from '../Icon.svelte';
|
||||||
|
@ -8,15 +9,88 @@
|
||||||
import SidebarItem from './SidebarItem.svelte';
|
import SidebarItem from './SidebarItem.svelte';
|
||||||
|
|
||||||
import { showSidebar } from '../../stores/sidebar';
|
import { showSidebar } from '../../stores/sidebar';
|
||||||
|
import Button from '../Button.svelte';
|
||||||
|
|
||||||
|
import DonateModal from '../DonateModal.svelte';
|
||||||
|
|
||||||
|
const { open: openModal } = getContext('simple-modal');
|
||||||
|
|
||||||
export let segment;
|
export let segment;
|
||||||
export let mobile = false;
|
export let mobile = false;
|
||||||
|
|
||||||
|
function openDonationModal() {
|
||||||
|
openModal(
|
||||||
|
DonateModal,
|
||||||
|
{},
|
||||||
|
{
|
||||||
|
closeButton: false,
|
||||||
|
styleWindow: { background: '#25294A', width: '500px' },
|
||||||
|
},
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
function close() {
|
function close() {
|
||||||
showSidebar.set(false);
|
showSidebar.set(false);
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<div
|
||||||
|
in:fly={{ x: 100, duration: 100 }}
|
||||||
|
out:fly={{ x: 100, duration: 100 }}
|
||||||
|
class={`sidebar overflow-x-hidden fixed w-full lg:w-64 h-full flex-col p-5 bg-background items-center z-50
|
||||||
|
${mobile ? 'flex' : 'hidden lg:flex'}`}
|
||||||
|
>
|
||||||
|
{#if !mobile}
|
||||||
|
<SidebarTitle />
|
||||||
|
{/if}
|
||||||
|
{#if mobile}
|
||||||
|
<div class="cursor-pointer" on:click={close}>
|
||||||
|
<Icon path={mdiCloseCircle} size={2} color="white" className="mb-8 mt-4 opacity-75" />
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
<SidebarItem
|
||||||
|
on:clicked={close}
|
||||||
|
active={segment === 'characters'}
|
||||||
|
image="/images/characters.png"
|
||||||
|
label="Character"
|
||||||
|
href="/characters"
|
||||||
|
/>
|
||||||
|
<SidebarItem
|
||||||
|
on:clicked={close}
|
||||||
|
active={segment === 'wish'}
|
||||||
|
image="/images/wish.png"
|
||||||
|
label="Wish Counter"
|
||||||
|
href="/wish"
|
||||||
|
/>
|
||||||
|
<SidebarItem
|
||||||
|
on:clicked={close}
|
||||||
|
active={segment === 'calculator'}
|
||||||
|
image="/images/calculator.png"
|
||||||
|
label="Calculator"
|
||||||
|
href="/calculator"
|
||||||
|
/>
|
||||||
|
<SidebarItem on:clicked={close} active={segment === 'items'} image="/images/items.png" label="Items" href="/items" />
|
||||||
|
<SidebarItem
|
||||||
|
on:clicked={close}
|
||||||
|
active={segment === 'todo'}
|
||||||
|
image="/images/todos.png"
|
||||||
|
label="Todo List"
|
||||||
|
href="/todo"
|
||||||
|
/>
|
||||||
|
<SidebarItem
|
||||||
|
on:clicked={close}
|
||||||
|
active={segment === 'settings'}
|
||||||
|
image="/images/settings.png"
|
||||||
|
label="Settings"
|
||||||
|
href="/settings"
|
||||||
|
/>
|
||||||
|
<div class="mt-8 md:mt-0 md:flex-1" />
|
||||||
|
<Button on:click={openDonationModal}>
|
||||||
|
<img class="inline w-8 h-8" src="/images/mora.png" alt="donate" />
|
||||||
|
Donate
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.sidebar::after {
|
.sidebar::after {
|
||||||
content: '';
|
content: '';
|
||||||
|
@ -30,54 +104,3 @@
|
||||||
background-size: contain;
|
background-size: contain;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<div
|
|
||||||
in:fly={{ x: 100, duration: 100 }}
|
|
||||||
out:fly={{ x: 100, duration: 100 }}
|
|
||||||
class={`sidebar overflow-x-hidden fixed w-full lg:w-64 h-full flex-col p-5 bg-background items-center z-50
|
|
||||||
${mobile ? 'flex' : 'hidden lg:flex'}`}>
|
|
||||||
{#if !mobile}
|
|
||||||
<SidebarTitle />
|
|
||||||
{/if}
|
|
||||||
{#if mobile}
|
|
||||||
<div class="cursor-pointer" on:click={close}>
|
|
||||||
<Icon path={mdiCloseCircle} size={2} color="white" className="mb-8 mt-4 opacity-75" />
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
<SidebarItem
|
|
||||||
on:clicked={close}
|
|
||||||
active={segment === 'characters'}
|
|
||||||
image="/images/characters.png"
|
|
||||||
label="Character"
|
|
||||||
href="/characters" />
|
|
||||||
<SidebarItem
|
|
||||||
on:clicked={close}
|
|
||||||
active={segment === 'wish'}
|
|
||||||
image="/images/wish.png"
|
|
||||||
label="Wish Counter"
|
|
||||||
href="/wish" />
|
|
||||||
<SidebarItem
|
|
||||||
on:clicked={close}
|
|
||||||
active={segment === 'calculator'}
|
|
||||||
image="/images/calculator.png"
|
|
||||||
label="Calculator"
|
|
||||||
href="/calculator" />
|
|
||||||
<SidebarItem
|
|
||||||
on:clicked={close}
|
|
||||||
active={segment === 'items'}
|
|
||||||
image="/images/items.png"
|
|
||||||
label="Items"
|
|
||||||
href="/items" />
|
|
||||||
<SidebarItem
|
|
||||||
on:clicked={close}
|
|
||||||
active={segment === 'todo'}
|
|
||||||
image="/images/todos.png"
|
|
||||||
label="Todo List"
|
|
||||||
href="/todo" />
|
|
||||||
<SidebarItem
|
|
||||||
on:clicked={close}
|
|
||||||
active={segment === 'settings'}
|
|
||||||
image="/images/settings.png"
|
|
||||||
label="Settings"
|
|
||||||
href="/settings" />
|
|
||||||
</div>
|
|
||||||
|
|
|
@ -30,6 +30,35 @@
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<svelte:head>
|
||||||
|
<title>Paimon.moe</title>
|
||||||
|
</svelte:head>
|
||||||
|
|
||||||
|
<Tailwind />
|
||||||
|
|
||||||
|
<Header />
|
||||||
|
<Modal>
|
||||||
|
<Sidebar {segment} />
|
||||||
|
{#if $showSidebar}
|
||||||
|
<Sidebar {segment} mobile />
|
||||||
|
{/if}
|
||||||
|
<DataSync>
|
||||||
|
<TodoData />
|
||||||
|
<SettingData />
|
||||||
|
<Toast />
|
||||||
|
<main style="flex: 1 0 auto;">
|
||||||
|
<slot />
|
||||||
|
</main>
|
||||||
|
</DataSync>
|
||||||
|
</Modal>
|
||||||
|
{#if $preloading && $delayedPreloading}
|
||||||
|
<div transition:fade class="loading-bar" />
|
||||||
|
{/if}
|
||||||
|
<p class="lg:ml-64 px-4 md:px-8 py-4 text-gray-600">
|
||||||
|
Paimon.moe is not affiliated with miHoYo.<br />
|
||||||
|
Genshin Impact, game content and materials are trademarks and copyrights of miHoYo.
|
||||||
|
</p>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.loading-bar {
|
.loading-bar {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
@ -63,32 +92,3 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<svelte:head>
|
|
||||||
<title>Paimon.moe</title>
|
|
||||||
</svelte:head>
|
|
||||||
|
|
||||||
<Tailwind />
|
|
||||||
|
|
||||||
<Header />
|
|
||||||
<Sidebar {segment} />
|
|
||||||
{#if $showSidebar}
|
|
||||||
<Sidebar {segment} mobile />
|
|
||||||
{/if}
|
|
||||||
<Modal>
|
|
||||||
<DataSync>
|
|
||||||
<TodoData />
|
|
||||||
<SettingData />
|
|
||||||
<Toast />
|
|
||||||
<main style="flex: 1 0 auto;">
|
|
||||||
<slot />
|
|
||||||
</main>
|
|
||||||
</DataSync>
|
|
||||||
</Modal>
|
|
||||||
{#if $preloading && $delayedPreloading}
|
|
||||||
<div transition:fade class="loading-bar" />
|
|
||||||
{/if}
|
|
||||||
<p class="lg:ml-64 px-4 md:px-8 py-4 text-gray-600">
|
|
||||||
Paimon.moe is not affiliated with miHoYo.<br />
|
|
||||||
Genshin Impact, game content and materials are trademarks and copyrights of miHoYo.
|
|
||||||
</p>
|
|
||||||
|
|
|
@ -111,11 +111,11 @@
|
||||||
<title>Wish Counter - Paimon.moe</title>
|
<title>Wish Counter - Paimon.moe</title>
|
||||||
<meta
|
<meta
|
||||||
name="description"
|
name="description"
|
||||||
content="Genshin Impact Wish Counter to track your pity counter and track when you get the character or weapon. You can also auto import the logs from your PC."
|
content="Genshin Impact Wish Counter to track your pity counter and track when you get the character or weapon. You can also auto import the logs from your PC or Android."
|
||||||
/>
|
/>
|
||||||
<meta
|
<meta
|
||||||
property="og:description"
|
property="og:description"
|
||||||
content="Genshin Impact Wish Counter to track your pity counter and track when you get the character or weapon. You can also auto import the logs from your PC."
|
content="Genshin Impact Wish Counter to track your pity counter and track when you get the character or weapon. You can also auto import the logs from your PC or Android."
|
||||||
/>
|
/>
|
||||||
</svelte:head>
|
</svelte:head>
|
||||||
<div class="pt-20 lg:ml-64 lg:pt-8 px-4 md:px-8">
|
<div class="pt-20 lg:ml-64 lg:pt-8 px-4 md:px-8">
|
||||||
|
|
Binary file not shown.
After Width: | Height: | Size: 9.4 KiB |
Binary file not shown.
After Width: | Height: | Size: 6.7 KiB |
Binary file not shown.
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
After Width: | Height: | Size: 6.6 KiB |
Binary file not shown.
After Width: | Height: | Size: 2.7 KiB |
Binary file not shown.
After Width: | Height: | Size: 7.2 KiB |
Loading…
Reference in New Issue