Add mail template, mail HTML generation and a few UI fixes

This commit is contained in:
2024-11-25 17:37:43 +01:00
parent d71e8b7910
commit 4df9297d47
12 changed files with 171 additions and 20 deletions

View File

@@ -0,0 +1,20 @@
<template>
<html>
<body style="min-width: 1000px;">
<div style="user-select: none; font-size: medium; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; width: 70%; margin: auto;">
<div style="margin: auto;">
<a href="https://obsidian.peaceultime.com" style="display: inline-block; ">
<span style="font-size: 25px; font-weight: bolder;">d[any]</span>
<img src="cid:logo.obsidian.peaceultime.com" style="width: 64px; height: 64px; display: inline;" alt="Logo" width="64" height="64"/>
</a>
</div>
<div style="width: 70%; padding: 1em 0;">
<slot />
</div>
<footer style="color: #707070; font-style: italic; display: flex; justify-content: center; align-items: center; padding: 1em 0;">
<p>Copyright Peaceultime - d[any] - 2024</p>
</footer>
</div>
</body>
</html>
</template>

View File

@@ -0,0 +1,22 @@
<template>
<div>
<p style="font-size: 19px; font-variant: small-caps;">Bienvenue sur d[any], <span style="">{{ username }}</span>.</p>
<p>Nous vous invitons à valider votre compte afin de profiter de toutes les fonctionnalités de d[any].</p>
<div style="display: flex; justify-content: center; align-items: center; padding: 1em 0;">
<a :href="`https://obsidian.peaceultime.com/user/mail-validation?u=${id}&t=${timestamp}&h=${0}`" target="_blank" style="border: 1px solid #999; padding: 1px 4px; background-color: #eee; font-weight: lighter; font-size: large">Je valide mon compte</a>
</div>
<div>
<span>Vous pouvez egalement copier le lien suivant pour valider votre compte: </span>
<pre style="border-bottom: 1px solid #999; font-size: small; display: inline-block; user-select: all">{{ `https://obsidian.peaceultime.com/user/mail-validation?u=${id}&t=${timestamp}&h=${0}` }}</pre>
</div>
<span style="font-size: small; padding-left: 8px;">Ce lien est valable 1 heure.</span>
</div>
</template>
<script setup lang="ts">
const { id, username, timestamp } = defineProps<{
id: number
username: string
timestamp: number
}>();
</script>

View File

@@ -0,0 +1,20 @@
<template>
<div class="">
<img />
<p>Bienvenue sur d[any], <span>{{ username }}</span>.</p>
</div>
<p class="">Nous vous invitons à valider votre compte en cliquant <a :href="`https://obsidian.peaceultime.com/user/mail-validation?u=${id}&t=${timestamp}&h=${hash(id.toString(), timestamp)}`"><Button>ici</Button></a> afin de profiter de toutes les fonctionnalités de d[any]</p>
<p class="">Vous pouvez egalement copier le lien suivant pour valider votre compte: {{ `https://obsidian.peaceultime.com/user/mail-validation?u=${id}&t=${timestamp}&h=${hash(id.toString(), timestamp)}` }}</p>
<span>Ce lien est valable 1 heure.</span>
<footer></footer>
</template>
<script setup lang="ts">
import { hash } from 'bun';
const { id, username, timestamp } = defineProps<{
id: number
username: string
timestamp: number
}>();
</script>