Fixed & finished Mail
nocnico
@@ -1,12 +1,190 @@
|
|||||||
import * as React from "react";
|
import * as React from "react";
|
||||||
import { Event, User } from "@repo/db";
|
import { Event, User } from "@repo/db";
|
||||||
|
|
||||||
import { Html, Button, render } from "@react-email/components";
|
import { Html, Button, render } from "@react-email/components";
|
||||||
|
|
||||||
|
const styles = `
|
||||||
|
* {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
a[x-apple-data-detectors] {
|
||||||
|
color: inherit !important;
|
||||||
|
text-decoration: inherit !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#MessageViewBody a {
|
||||||
|
color: inherit;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
line-height: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.desktop_hide,
|
||||||
|
.desktop_hide table {
|
||||||
|
mso-hide: all;
|
||||||
|
display: none;
|
||||||
|
max-height: 0px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.image_block img + div {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
sup,
|
||||||
|
sub {
|
||||||
|
font-size: 75%;
|
||||||
|
line-height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu_block.desktop_hide .menu-links span {
|
||||||
|
mso-hide: all;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 700px) {
|
||||||
|
.desktop_hide table.icons-inner {
|
||||||
|
display: inline-block !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icons-inner {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icons-inner td {
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
|
||||||
const Template = ({ event, user }: { user: User; event: Event }) => (
|
const Template = ({ event, user }: { user: User; event: Event }) => (
|
||||||
<Html lang="en">
|
<Html lang="de">
|
||||||
<p>You completed the Course {event.name}</p>
|
<meta content="text/html; charset=utf-8" httpEquiv="Content-Type" />
|
||||||
<p>Congratulation</p>
|
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
|
||||||
|
<link
|
||||||
|
href="https://fonts.googleapis.com/css?family=Montserrat"
|
||||||
|
rel="stylesheet"
|
||||||
|
type="text/css"
|
||||||
|
/>
|
||||||
|
<style>{styles}</style>
|
||||||
|
<body style={{ backgroundColor: "#FFFFFF", margin: 0, padding: 0 }}>
|
||||||
|
<table width="100%">
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td>
|
||||||
|
<table
|
||||||
|
align="center"
|
||||||
|
width="680"
|
||||||
|
style={{ margin: "0 auto", color: "#000000" }}
|
||||||
|
>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td style={{ textAlign: "center", paddingTop: "30px" }}>
|
||||||
|
<img
|
||||||
|
src="http://localhost:3000/mail/var_logo.png"
|
||||||
|
alt="Logo"
|
||||||
|
width="80"
|
||||||
|
style={{ display: "block", margin: "0 auto" }}
|
||||||
|
/>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
textAlign: "center",
|
||||||
|
fontSize: "46px",
|
||||||
|
color: "#011936",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<strong>Glückwunsch!</strong>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
textAlign: "center",
|
||||||
|
fontSize: "30px",
|
||||||
|
color: "#011936",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Du hast den Kurs <strong>{event.name}</strong>{" "}
|
||||||
|
abgeschlossen!
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td style={{ textAlign: "center", padding: "20px" }}>
|
||||||
|
<img
|
||||||
|
src="http://localhost:3000/badges/p-1.png"
|
||||||
|
alt="Badge"
|
||||||
|
width="80"
|
||||||
|
style={{ display: "block", margin: "0 auto" }}
|
||||||
|
/>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td
|
||||||
|
style={{
|
||||||
|
textAlign: "center",
|
||||||
|
fontSize: "18px",
|
||||||
|
color: "#011936",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Mit dem Abschluss von Kursen verdienst du dir nach und
|
||||||
|
nach immer mehr Badges.
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td style={{ textAlign: "center", paddingTop: "20px" }}>
|
||||||
|
<a
|
||||||
|
href="https://your-platform.com"
|
||||||
|
style={{
|
||||||
|
padding: "10px",
|
||||||
|
textDecoration: "none",
|
||||||
|
borderRadius: "20px",
|
||||||
|
color: "#011936",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Impressum
|
||||||
|
</a>
|
||||||
|
<span style={{ margin: "0 10px" }}>|</span>
|
||||||
|
<a
|
||||||
|
href="https://your-platform.com"
|
||||||
|
style={{
|
||||||
|
padding: "10px",
|
||||||
|
textDecoration: "none",
|
||||||
|
borderRadius: "20px",
|
||||||
|
color: "#011936",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Datenschutzerklärung
|
||||||
|
</a>
|
||||||
|
<span style={{ margin: "0 10px" }}>|</span>
|
||||||
|
<a
|
||||||
|
href="https://your-platform.com"
|
||||||
|
style={{
|
||||||
|
padding: "10px",
|
||||||
|
textDecoration: "none",
|
||||||
|
borderRadius: "20px",
|
||||||
|
color: "#011936",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Knowledgebase
|
||||||
|
</a>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</body>
|
||||||
</Html>
|
</Html>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|||||||
@@ -16,7 +16,7 @@
|
|||||||
"typescript": "latest"
|
"typescript": "latest"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@react-email/components": "^0.0.13",
|
"@react-email/components": "^0.0.32",
|
||||||
"axios": "^1.7.9",
|
"axios": "^1.7.9",
|
||||||
"cron": "^4.1.0",
|
"cron": "^4.1.0",
|
||||||
"dotenv": "^16.4.7",
|
"dotenv": "^16.4.7",
|
||||||
|
|||||||
BIN
apps/hub/public/badges/d-1.png
Normal file
|
After Width: | Height: | Size: 16 KiB |
BIN
apps/hub/public/badges/d-2.png
Normal file
|
After Width: | Height: | Size: 22 KiB |
BIN
apps/hub/public/badges/d-3.png
Normal file
|
After Width: | Height: | Size: 28 KiB |
BIN
apps/hub/public/badges/day-1-member.png
Normal file
|
After Width: | Height: | Size: 1.7 MiB |
BIN
apps/hub/public/badges/p-1.png
Normal file
|
After Width: | Height: | Size: 16 KiB |
BIN
apps/hub/public/badges/p-2.png
Normal file
|
After Width: | Height: | Size: 23 KiB |
BIN
apps/hub/public/badges/p-3.png
Normal file
|
After Width: | Height: | Size: 29 KiB |
BIN
apps/hub/public/mail/new_badge_bg.png
Normal file
|
After Width: | Height: | Size: 24 KiB |
BIN
apps/hub/public/mail/var_logo.png
Normal file
|
After Width: | Height: | Size: 420 KiB |