Add meta tag for each page

pull/1/head
I Made Setia Baruna 2021-02-02 19:17:44 +08:00
parent fb83305a57
commit 544c61e48f
5 changed files with 104 additions and 50 deletions

View File

@ -39,6 +39,14 @@
<svelte:head> <svelte:head>
<title>Calculator - Paimon.moe</title> <title>Calculator - Paimon.moe</title>
<meta
name="description"
content="Genshin Impact Calculator to calculate how many mora and items needed for your character or weapon ascension and the character talent material, also quickly add the items to todo list! Hero's Wit calculator."
/>
<meta
property="og:description"
content="Genshin Impact Calculator to calculate how many mora and items needed for your character or weapon ascension and the character talent material, also quickly add the items to todo list! Hero's Wit calculator."
/>
</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">
<div class="flex justify-center md:justify-start mb-4"> <div class="flex justify-center md:justify-start mb-4">
@ -49,26 +57,30 @@
</div> </div>
<div <div
class="flex flex-col items-center md:flex-row-reverse md:justify-end md:items-start lg:items-center mb-2" class="flex flex-col items-center md:flex-row-reverse md:justify-end md:items-start lg:items-center mb-2"
bind:this={weaponCalc}> bind:this={weaponCalc}
>
<Button on:click={() => scroll('character')}> <Button on:click={() => scroll('character')}>
<Icon size={0.8} path={mdiArrowDown} /> <Icon size={0.8} path={mdiArrowDown} />
Go To Character Calculator Go To Character Calculator
</Button> </Button>
<h1 <h1
class="font-display font-black text-center mt-2 md:mt-0 md:mr-2 xl:mr-8 text-3xl lg:text-left lg:text-5xl text-white"> class="font-display font-black text-center mt-2 md:mt-0 md:mr-2 xl:mr-8 text-3xl lg:text-left lg:text-5xl text-white"
>
Weapon Calculator Weapon Calculator
</h1> </h1>
</div> </div>
<WeaponCalculator /> <WeaponCalculator />
<div <div
class="flex flex-col items-center md:flex-row-reverse md:justify-end md:items-start lg:items-center mt-8 mb-2" class="flex flex-col items-center md:flex-row-reverse md:justify-end md:items-start lg:items-center mt-8 mb-2"
bind:this={characterCalc}> bind:this={characterCalc}
>
<Button on:click={() => scroll('weapon')}> <Button on:click={() => scroll('weapon')}>
<Icon size={0.8} path={mdiArrowUp} /> <Icon size={0.8} path={mdiArrowUp} />
Go To Weapon Calculator Go To Weapon Calculator
</Button> </Button>
<h1 <h1
class="font-display font-black text-center mt-2 md:mt-0 md:mr-2 xl:mr-8 text-3xl lg:text-left lg:text-5xl text-white"> class="font-display font-black text-center mt-2 md:mt-0 md:mr-2 xl:mr-8 text-3xl lg:text-left lg:text-5xl text-white"
>
Character Calculator Character Calculator
</h1> </h1>
</div> </div>

View File

@ -147,36 +147,16 @@
$: selectedWeapon, parseData(); $: selectedWeapon, parseData();
</script> </script>
<style>
td {
@apply text-white;
@apply px-4;
@apply align-top;
scrollbar-width: none;
&::-webkit-scrollbar {
width: 0;
height: 0;
}
&.weapon-cell {
min-width: 29.5rem;
@apply whitespace-normal;
@apply overflow-x-scroll;
@apply overflow-y-hidden;
}
}
tr:last-child {
td {
@apply border-b-0;
}
}
</style>
<svelte:head> <svelte:head>
<title>Item List - Paimon.moe</title> <title>Item List - Paimon.moe</title>
<meta
name="description"
content="Genshin Impact Item List Table to see what to farm each day and for each character or weapon"
/>
<meta
property="og:description"
content="Genshin Impact Item List Table to see what to farm each day and for each character or weapon"
/>
</svelte:head> </svelte:head>
<div class="lg:ml-64 pt-20 lg:pt-8"> <div class="lg:ml-64 pt-20 lg:pt-8">
<h1 class="font-display px-4 md:px-8 font-black text-5xl text-white">Item List</h1> <h1 class="font-display px-4 md:px-8 font-black text-5xl text-white">Item List</h1>
@ -206,7 +186,11 @@
{#each Object.entries(charactersDays[day]) as [itemName, chars], index} {#each Object.entries(charactersDays[day]) as [itemName, chars], index}
<tr> <tr>
<td <td
class={index === Object.entries(charactersDays[day]).length - 1 && Object.entries(weaponsDays[day]).length === 0 ? 'border-gray-700 border-b py-2' : 'py-2'}> class={index === Object.entries(charactersDays[day]).length - 1 &&
Object.entries(weaponsDays[day]).length === 0
? 'border-gray-700 border-b py-2'
: 'py-2'}
>
{#if index === 0}{dayArr[0]}<br />{dayArr[1]}{/if} {#if index === 0}{dayArr[0]}<br />{dayArr[1]}{/if}
</td> </td>
<td class="border-gray-700 border-b text-center align-middle py-2"> <td class="border-gray-700 border-b text-center align-middle py-2">
@ -214,11 +198,13 @@
<div <div
on:click={() => openAddTodo(itemName)} on:click={() => openAddTodo(itemName)}
class="h-12 w-12 md:h-14 md:w-14 mr-2 cursor-pointer hover:bg-background rounded-xl class="h-12 w-12 md:h-14 md:w-14 mr-2 cursor-pointer hover:bg-background rounded-xl
inline-flex items-center justify-center align-top"> inline-flex items-center justify-center align-top"
>
<img <img
class="w-full max-h-full object-contain" class="w-full max-h-full object-contain"
src={`/images/items/${itemName}.png`} src={`/images/items/${itemName}.png`}
alt={itemName} /> alt={itemName}
/>
</div> </div>
<span>{itemGroup[itemName].name}</span> <span>{itemGroup[itemName].name}</span>
</div> </div>
@ -227,12 +213,14 @@
{#each chars as char} {#each chars as char}
<div <div
class="h-12 w-12 md:h-14 md:w-14 cursor-pointer mr-2 hover:bg-background rounded-xl class="h-12 w-12 md:h-14 md:w-14 cursor-pointer mr-2 hover:bg-background rounded-xl
inline-flex items-center justify-center align-top"> inline-flex items-center justify-center align-top"
>
<img <img
class="w-full max-h-full object-contain" class="w-full max-h-full object-contain"
src={`/images/characters/${char}.png`} src={`/images/characters/${char}.png`}
alt={char} alt={char}
title={characters[char].name} /> title={characters[char].name}
/>
</div> </div>
{/each} {/each}
</td> </td>
@ -241,7 +229,11 @@
{#each Object.entries(weaponsDays[day]) as [itemName, weapons], index} {#each Object.entries(weaponsDays[day]) as [itemName, weapons], index}
<tr> <tr>
<td <td
class={index === Object.entries(weaponsDays[day]).length - 1 || Object.entries(charactersDays[day]).length === 0 ? 'border-gray-700 border-b py-2' : 'py-2'}> class={index === Object.entries(weaponsDays[day]).length - 1 ||
Object.entries(charactersDays[day]).length === 0
? 'border-gray-700 border-b py-2'
: 'py-2'}
>
{#if index === 0 && Object.entries(charactersDays[day]).length === 0}{dayArr[0]}<br />{dayArr[1]}{/if} {#if index === 0 && Object.entries(charactersDays[day]).length === 0}{dayArr[0]}<br />{dayArr[1]}{/if}
</td> </td>
<td class="border-gray-700 border-b text-center py-2"> <td class="border-gray-700 border-b text-center py-2">
@ -249,11 +241,13 @@
<div <div
on:click={() => openAddTodo(itemName)} on:click={() => openAddTodo(itemName)}
class="h-12 w-12 md:h-14 md:w-14 mr-2 cursor-pointer hover:bg-background rounded-xl class="h-12 w-12 md:h-14 md:w-14 mr-2 cursor-pointer hover:bg-background rounded-xl
inline-flex items-center justify-center align-top"> inline-flex items-center justify-center align-top"
>
<img <img
class="w-full max-h-full object-contain" class="w-full max-h-full object-contain"
src={`/images/items/${itemName}.png`} src={`/images/items/${itemName}.png`}
alt={itemName} /> alt={itemName}
/>
</div> </div>
<span class="whitespace-normal text-left w-20">{itemGroup[itemName].name}</span> <span class="whitespace-normal text-left w-20">{itemGroup[itemName].name}</span>
</div> </div>
@ -262,12 +256,14 @@
{#each weapons as weapon} {#each weapons as weapon}
<div <div
class="h-12 w-12 md:h-14 md:w-14 cursor-pointer mr-2 mb-2 hover:bg-background rounded-xl class="h-12 w-12 md:h-14 md:w-14 cursor-pointer mr-2 mb-2 hover:bg-background rounded-xl
inline-flex items-center justify-center align-top"> inline-flex items-center justify-center align-top"
>
<img <img
class="w-full max-h-full object-contain" class="w-full max-h-full object-contain"
src={`/images/weapons/${weapon}.png`} src={`/images/weapons/${weapon}.png`}
alt={weapon} alt={weapon}
title={weaponList[weapon].name} /> title={weaponList[weapon].name}
/>
</div> </div>
{/each} {/each}
</td> </td>
@ -296,11 +292,13 @@
<div class="flex items-center"> <div class="flex items-center">
<div <div
on:click={() => openAddTodo(itemName)} on:click={() => openAddTodo(itemName)}
class="h-12 w-12 md:h-14 md:w-14 mr-2 cursor-pointer hover:bg-background rounded-xl inline-flex items-center justify-center"> class="h-12 w-12 md:h-14 md:w-14 mr-2 cursor-pointer hover:bg-background rounded-xl inline-flex items-center justify-center"
>
<img <img
class="w-full max-h-full object-contain" class="w-full max-h-full object-contain"
src={`/images/items/${itemName}.png`} src={`/images/items/${itemName}.png`}
alt={itemName} /> alt={itemName}
/>
</div> </div>
<span>{itemList[itemName].name}</span> <span>{itemList[itemName].name}</span>
</div> </div>
@ -309,12 +307,14 @@
{#each Object.entries(char) as [charName, type]} {#each Object.entries(char) as [charName, type]}
<div <div
class="h-12 w-12 md:h-14 md:w-14 mb-2 cursor-pointer mr-2 hover:bg-background rounded-xl class="h-12 w-12 md:h-14 md:w-14 mb-2 cursor-pointer mr-2 hover:bg-background rounded-xl
inline-flex items-center justify-center align-top"> inline-flex items-center justify-center align-top"
>
<img <img
class="w-full max-h-full object-contain" class="w-full max-h-full object-contain"
src={`/images/${type}/${charName}.png`} src={`/images/${type}/${charName}.png`}
alt={charName} alt={charName}
title={type === 'characters' ? characters[charName].name : weaponList[charName].name} /> title={type === 'characters' ? characters[charName].name : weaponList[charName].name}
/>
</div> </div>
{/each} {/each}
</td> </td>
@ -325,3 +325,31 @@
</div> </div>
</div> </div>
</div> </div>
<style>
td {
@apply text-white;
@apply px-4;
@apply align-top;
scrollbar-width: none;
&::-webkit-scrollbar {
width: 0;
height: 0;
}
&.weapon-cell {
min-width: 29.5rem;
@apply whitespace-normal;
@apply overflow-x-scroll;
@apply overflow-y-hidden;
}
}
tr:last-child {
td {
@apply border-b-0;
}
}
</style>

View File

@ -272,6 +272,14 @@
<svelte:head> <svelte:head>
<title>Todo List - Paimon.moe</title> <title>Todo List - Paimon.moe</title>
<meta
name="description"
content="Genshin Impact Todo List to plan and track items and mora you need, you can also see resin approximation needed to farm the items!"
/>
<meta
property="og:description"
content="Genshin Impact Todo List to plan and track items and mora you need, you can also see resin approximation needed to farm the items!"
/>
</svelte:head> </svelte:head>
<div class="lg:ml-64 pt-20 px-2 md:px-8 lg:pt-8"> <div class="lg:ml-64 pt-20 px-2 md:px-8 lg:pt-8">
<Masonry stretchFirst={true} bind:refreshLayout bind:columnCount items={id}> <Masonry stretchFirst={true} bind:refreshLayout bind:columnCount items={id}>

View File

@ -24,6 +24,14 @@
<svelte:head> <svelte:head>
<title>Wish Counter - Paimon.moe</title> <title>Wish Counter - Paimon.moe</title>
<meta
name="description"
content="Genshin Impact Wish Counter to track your pity counter and track when you get the character or weapon"
/>
<meta
property="og:description"
content="Genshin Impact Wish Counter to track your pity counter and track when you get the character or weapon"
/>
</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">
<div class="flex flex-col md:flex-row mb-4 items-center"> <div class="flex flex-col md:flex-row mb-4 items-center">

View File

@ -6,8 +6,7 @@
<meta name="theme-color" content="#333333" /> <meta name="theme-color" content="#333333" />
<meta <meta
name="description" name="description"
content="Your best Genshin Impact companion! Help you plan what to farm with ascension calculator and database. content="Your best Genshin Impact companion! Help you plan what to farm with ascension calculator and database. Also track your progress with todo and wish counter."
Also track your progress with todo and wish counter."
/> />
<meta property="og:title" content="Paimon.moe" /> <meta property="og:title" content="Paimon.moe" />
@ -16,8 +15,7 @@
<meta property="og:image" content="https://paimon.moe/paimon-og.png" /> <meta property="og:image" content="https://paimon.moe/paimon-og.png" />
<meta <meta
property="og:description" property="og:description"
content="Your best Genshin Impact companion! Help you plan what to farm with ascension calculator and database. content="Your best Genshin Impact companion! Help you plan what to farm with ascension calculator and database. Also track your progress with todo and wish counter."
Also track your progress with todo and wish counter."
/> />
%sapper.base% %sapper.base%