mirror of
https://github.com/AppFlowy-IO/AppFlowy-Cloud.git
synced 2025-04-19 03:24:42 -04:00
chore: modified magic link html (#1329)
* chore: upload the lock file of package * chore: modified magic link html
This commit is contained in:
Kilu.He
khorshuheng
parent
62c86e4a97
commit
6268a87820
6 changed files with 5149 additions and 313 deletions
|
|
@ -1,191 +1,143 @@
|
|||
<!DOCTYPE html>
|
||||
<!DOCTYPE>
|
||||
<html lang="en" xmlns:v="urn:schemas-microsoft-com:vml">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="x-apple-disable-message-reformatting">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="format-detection" content="telephone=no, date=no, address=no, email=no, url=no">
|
||||
<meta name="color-scheme" content="light dark">
|
||||
<meta name="supported-color-schemes" content="light dark">
|
||||
<!--[if mso]>
|
||||
<noscript>
|
||||
<xml>
|
||||
<o:OfficeDocumentSettings xmlns:o="urn:schemas-microsoft-com:office:office">
|
||||
<o:PixelsPerInch>96</o:PixelsPerInch>
|
||||
</o:OfficeDocumentSettings>
|
||||
</xml>
|
||||
</noscript>
|
||||
<style>
|
||||
td, th, div, p, a, h1, h2, h3, h4, h5, h6 {
|
||||
font-family: "Segoe UI", sans-serif;
|
||||
mso-line-height-rule: exactly;
|
||||
}
|
||||
</style>
|
||||
<![endif]-->
|
||||
<title>Magic Link</title>
|
||||
<style>
|
||||
.border-spacing-4 {
|
||||
--tw-border-spacing-x: 16px;
|
||||
--tw-border-spacing-y: 16px;
|
||||
border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y)
|
||||
}
|
||||
|
||||
.border-spacing-6 {
|
||||
--tw-border-spacing-x: 24px;
|
||||
--tw-border-spacing-y: 24px;
|
||||
border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y)
|
||||
}
|
||||
|
||||
.hover-opacity-90:hover {
|
||||
opacity: 0.9 !important
|
||||
}
|
||||
</style>
|
||||
<meta charset="utf-8">
|
||||
<meta name="x-apple-disable-message-reformatting">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="format-detection" content="telephone=no, date=no, address=no, email=no, url=no">
|
||||
<meta name="color-scheme" content="light dark">
|
||||
<meta name="supported-color-schemes" content="light dark">
|
||||
<!--[if mso]>
|
||||
<noscript>
|
||||
<xml>
|
||||
<o:OfficeDocumentSettings xmlns:o="urn:schemas-microsoft-com:office:office">
|
||||
<o:PixelsPerInch>96</o:PixelsPerInch>
|
||||
</o:OfficeDocumentSettings>
|
||||
</xml>
|
||||
</noscript>
|
||||
<style>
|
||||
td,th,div,p,a,h1,h2,h3,h4,h5,h6 {font-family: "Segoe UI", sans-serif; mso-line-height-rule: exactly;}
|
||||
</style>
|
||||
<![endif]-->
|
||||
<title>Login for AppFlowy</title>
|
||||
</head>
|
||||
<body style="margin: 0; width: 100%; background-color: #faf5ff; padding: 0; -webkit-font-smoothing: antialiased; word-break: break-word">
|
||||
<div style="display: none">
|
||||
Sign in using magic link or OTP.
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
 ͏  ͏  ͏  ͏  ͏
|
||||
</div>
|
||||
<div role="article" aria-roledescription="email" aria-label="Magic Link" lang="en">
|
||||
<div style="display: flex; flex-direction: column; justify-content: center; background-color: #faf5ff; padding: 24px; font-family: Helvetica, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif; color: #000">
|
||||
<table align="center" class="border-spacing-4"
|
||||
style="display: flex; width: 700px; border-spacing: 16px; flex-direction: column; align-items: center; justify-content: flex-start; background-color: #fff; padding: 32px"
|
||||
cellpadding="0" cellspacing="0" role="none">
|
||||
<tr>
|
||||
<td style="text-align: center">
|
||||
<img src="https://raw.githubusercontent.com/AppFlowy-IO/AppFlowy-Cloud/main/assets/mailer_templates/build_production/images/appflowy.png"
|
||||
style="max-width: 100%; vertical-align: middle; line-height: 1; height: 56px; width: 56px; overflow: hidden; object-fit: cover"
|
||||
alt="">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<table align="center" class="border-spacing-6"
|
||||
style="display: flex; border-spacing: 24px; flex-direction: column; align-items: center; padding: 0"
|
||||
cellpadding="0" cellspacing="0" role="none">
|
||||
<tr>
|
||||
<td>
|
||||
<p style="margin: 0; text-align: center; font-size: 30px; font-weight: 700">
|
||||
Your login code for AppFlowy
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<p style="margin: 0; text-align: center; font-size: 18px">
|
||||
This link and code will be expire in 5 minutes for security reasons.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div style="text-align: center;">
|
||||
<a href="{{ .ConfirmationURL }}" class="hover-opacity-90"
|
||||
style="margin: 0; display: inline-block; cursor: pointer; border-radius: 16px; padding: 16px 24px; font-size: 16px; font-weight: 600; line-height: 1; color: #f8fafc; text-decoration: none; background-color: #9327ff">
|
||||
<!--[if mso]>
|
||||
<i style="mso-font-width: 150%; mso-text-raise: 30px" hidden> </i>
|
||||
<![endif]-->
|
||||
<span style="mso-text-raise: 16px">
|
||||
<div style="font-size: 16px; font-weight: 700">Login to AppFlowy</div>
|
||||
</span>
|
||||
<!--[if mso]>
|
||||
<i hidden style="mso-font-width: 150%;"> ​</i>
|
||||
<![endif]-->
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div style="margin-left: auto; margin-right: auto; text-align: center; font-size: 16px; line-height: 18px">
|
||||
If the link does not work, you can use the verification code
|
||||
directly:
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="text-align: center;">
|
||||
<p style="margin: 0; display: inline-block; border-radius: 4px; background-color: #e5e7eb; padding: 8px; text-align: center; font-size: 18px; font-weight: 700; color: #000">
|
||||
{{ .Token }}</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div role="separator"
|
||||
style="background-color: #cbd5e1; height: 1px; line-height: 1px; margin: 24px 10%">‍
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<p style="margin: 0; text-align: center; font-size: 14px; font-weight: 500; color: #4b5563">
|
||||
Bring projects, knowledge, and teams together with the power of AI.
|
||||
</p>
|
||||
<p style="cursor: default; text-align: center">
|
||||
<a href="https://twitter.com/appflowy" style="margin-right: 16px; text-decoration: none">
|
||||
<img src="https://raw.githubusercontent.com/AppFlowy-IO/AppFlowy-Cloud/main/assets/mailer_templates/build_production/images/twitter.png"
|
||||
width="20" alt="Maizzle"
|
||||
style="max-width: 100%; vertical-align: middle; line-height: 1;">
|
||||
</a>
|
||||
<a href="https://www.reddit.com/r/AppFlowy" style="margin-right: 16px; text-decoration: none;">
|
||||
<img src="https://raw.githubusercontent.com/AppFlowy-IO/AppFlowy-Cloud/main/assets/mailer_templates/build_production/images/reddit.png"
|
||||
width="20" alt="Maizzle"
|
||||
style="max-width: 100%; vertical-align: middle; line-height: 1;">
|
||||
</a>
|
||||
<a href="https://github.com/AppFlowy-IO/AppFlowy"
|
||||
style="margin-right: 16px; text-decoration: none;">
|
||||
<img src="https://raw.githubusercontent.com/AppFlowy-IO/AppFlowy-Cloud/main/assets/mailer_templates/build_production/images/github.png"
|
||||
width="20" alt="Maizzle"
|
||||
style="max-width: 100%; vertical-align: middle; line-height: 1;">
|
||||
</a>
|
||||
<a href="https://discord.gg/9Q2xaN37tV" style="margin-right: 16px; text-decoration: none;">
|
||||
<img src="https://raw.githubusercontent.com/AppFlowy-IO/AppFlowy-Cloud/main/assets/mailer_templates/build_production/images/discord.png"
|
||||
width="20" alt="Maizzle"
|
||||
style="max-width: 100%; vertical-align: middle; line-height: 1;">
|
||||
</a>
|
||||
</p>
|
||||
<p style="margin: 0; text-align: center; font-size: 14px; font-weight: 500; color: #4b5563;">
|
||||
Copyright © 2025, AppFlowy Inc.
|
||||
</p>
|
||||
<p style="text-align: center; font-size: 14px; font-weight: 500; color: #4b5563;">
|
||||
Need Help? <a href="mailto:support@appflowy.io" style="color: #4b5563;">support@appflowy.io</a>
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div role="article" aria-roledescription="email" aria-label="Login for AppFlowy" lang="en">
|
||||
<div style="display: none">
|
||||
To login to AppFlowy, follow this link {{ .ConfirmationURL }}
|
||||
</div>
|
||||
</div>
|
||||
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#f3e8ff" style="font-family: Google Sans, Robot, Arial, sans-serif; padding: 24px; color: #000000;" role="presentation">
|
||||
<tr>
|
||||
<td align="center" valign="top">
|
||||
<table width="600" border="0" cellpadding="0" cellspacing="0" bgcolor="#ffffff" style="border-radius: 12px; padding: 32px; margin: 0 auto;" role="presentation">
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 24px;">
|
||||
<img src="https://raw.githubusercontent.com/AppFlowy-IO/AppFlowy-Cloud/main/assets/mailer_templates/build_production/images/appflowy.png" width="32" height="32" style="max-width: 100%; vertical-align: middle; line-height: 1; border: 0; display: block; margin: 0 auto" alt="">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 8px;">
|
||||
<h1 style="font-size: 24px; font-weight: bold; margin: 0; color: #000000;">Login for AppFlowy</h1>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 40px;">
|
||||
<p style="font-size: 16px; line-height: 1.5; margin: 0;">We received a request to log in to your AppFlowy account.</p>
|
||||
<p style="font-size: 16px; line-height: 1.5; margin: 2px 0 0;">You can log in using either of the following options:</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 12px;">
|
||||
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#f8faff" style="border-radius: 20px; padding: 24px 20px;" role="presentation">
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 16px;">
|
||||
<h2 style="font-size: 16px; font-weight: bold; margin: 0; color: #000000;">Option 1: Magic Link (Fast & Easy)</h2>
|
||||
<p style="font-size: 14px; color: #6F748C; margin: 10px 0 0;">Click the button or link below to log in instantly</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 16px;">
|
||||
<table border="0" cellpadding="0" cellspacing="0" style="margin: 0 auto;" role="presentation">
|
||||
<tr>
|
||||
<td align="center" bgcolor="#9327ff" style="border-radius: 10px; padding: 10px 16px;">
|
||||
<a href="{{ .ConfirmationURL }}" style="color: #ffffff; font-weight: 600; font-size: 14px; text-decoration: none; display: inline-block;">Login to AppFlowy</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center">
|
||||
<p style="padding-bottom: 16px; font-size: 12px; color: #6F748C; margin: 0;">Or paste this into your browser:</p>
|
||||
<p style="max-width: 384px;margin: 0;">
|
||||
<a href="{{ .ConfirmationURL }}" style="font-size: 12px; text-decoration: none; text-align: center; color: #6F748C; font-weight: bold; margin: 0; word-break: break-all;">
|
||||
{{ .ConfirmationURL }}
|
||||
</a>
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 20px;">
|
||||
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#f8faff" style="border-radius: 20px; padding: 24px 20px;" role="presentation">
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 16px;">
|
||||
<h2 style="font-size: 16px; font-weight: bold; margin: 0; color: #000000;">Option 2: One-Time Password (OTP)</h2>
|
||||
<p style="font-size: 14px; color: #6F748C; margin: 10px 0 0;">Prefer to enter a code instead? Use the one-time code below</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center">
|
||||
<span style="background-color: #ffffff; padding: 8px; border-radius: 6px; font-weight: 600; font-size: 16px; display: inline-block;">{{ .Token }}</span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 60px;">
|
||||
<p style="font-size: 12px; color: #6F748C; margin: 0;">This code and magic link will expire in 5 minutes for security reasons.</p>
|
||||
<p style="font-size: 12px; color: #6F748C; margin: 0;">If you didn't initiate this login, you can safely ignore this email. No action is needed.</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 0 0 24px;">
|
||||
<table width="80%" border="0" cellpadding="0" cellspacing="0" style="border-top: 1px solid #e5e7eb; margin: 0 auto;" role="presentation">
|
||||
<tr>
|
||||
<td></td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center">
|
||||
<p style="font-size: 12px; color: #6F748C; margin: 0 0 15px;">Bring projects, knowledge, and teams together with the power of AI.</p>
|
||||
<p style="margin: 0 0 15px;">
|
||||
<a href="https://twitter.com/appflowy" style="text-decoration: none; display: inline-block; margin: 0 10px 0 0;">
|
||||
<img src="https://raw.githubusercontent.com/AppFlowy-IO/AppFlowy-Cloud/main/assets/mailer_templates/build_production/images/twitter.png" width="20" height="20" alt="Twitter" style="max-width: 100%; vertical-align: middle; line-height: 1; border: 0;">
|
||||
</a>
|
||||
<a href="https://www.reddit.com/r/AppFlowy" style="text-decoration: none; display: inline-block; margin: 0 10px 0 0;">
|
||||
<img src="https://raw.githubusercontent.com/AppFlowy-IO/AppFlowy-Cloud/main/assets/mailer_templates/build_production/images/reddit.png" width="20" height="20" alt="Reddit" style="max-width: 100%; vertical-align: middle; line-height: 1; border: 0;">
|
||||
</a>
|
||||
<a href="https://github.com/AppFlowy-IO/AppFlowy" style="text-decoration: none; display: inline-block; margin: 0 10px 0 0;">
|
||||
<img src="https://raw.githubusercontent.com/AppFlowy-IO/AppFlowy-Cloud/main/assets/mailer_templates/build_production/images/github.png" width="20" height="20" alt="GitHub" style="max-width: 100%; vertical-align: middle; line-height: 1; border: 0;">
|
||||
</a>
|
||||
<a href="https://discord.gg/9Q2xaN37tV" style="text-decoration: none; display: inline-block;">
|
||||
<img src="https://raw.githubusercontent.com/AppFlowy-IO/AppFlowy-Cloud/main/assets/mailer_templates/build_production/images/discord.png" width="20" height="20" alt="Discord" style="max-width: 100%; vertical-align: middle; line-height: 1; border: 0;">
|
||||
</a>
|
||||
</p>
|
||||
<p style="font-size: 12px; color: #6F748C; margin: 0 0 10px;">Copyright © 2025, AppFlowy Inc.</p>
|
||||
<p style="font-size: 12px; color: #6F748C; margin: 0;">
|
||||
Need Help? <a href="mailto:support@appflowy.io" style="color: #6F748C;">support@appflowy.io</a>
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
1
email_template/.npmrc
Normal file
1
email_template/.npmrc
Normal file
|
|
@ -0,0 +1 @@
|
|||
shamefully-hoist=true
|
||||
|
|
@ -7,9 +7,13 @@ AppFlowy Cloud services.
|
|||
Run this command and follow the prompts
|
||||
|
||||
```bash
|
||||
npm install
|
||||
# install pnpm@8.5.0
|
||||
|
||||
npm run dev
|
||||
npm install -g pnpm@8.5.0
|
||||
|
||||
pnpm i
|
||||
|
||||
pnpm run dev
|
||||
```
|
||||
|
||||
## Build
|
||||
|
|
@ -18,5 +22,6 @@ Run this command to build the project to generate the final output in the assets
|
|||
folder
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
pnpm run build
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -5,9 +5,14 @@
|
|||
"build": "maizzle build production"
|
||||
},
|
||||
"dependencies": {
|
||||
"@maizzle/framework": "latest",
|
||||
"@maizzle/framework": "4.4.6",
|
||||
"tailwindcss-box-shadow": "^2.0.0",
|
||||
"tailwindcss-email-variants": "^2.0.0",
|
||||
"tailwindcss-mso": "^1.4.1"
|
||||
"tailwindcss-mso": "^1.4.1",
|
||||
"tailwindcss": "^3.3.0"
|
||||
},
|
||||
"engines": {
|
||||
"pnpm": ">=8.0.0 <9.0.0",
|
||||
"node": ">=14.0.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
4873
email_template/pnpm-lock.yaml
generated
Normal file
4873
email_template/pnpm-lock.yaml
generated
Normal file
File diff suppressed because it is too large
Load diff
|
|
@ -1,131 +1,131 @@
|
|||
---
|
||||
title: "Magic Link"
|
||||
preheader: "Sign in using magic link or OTP."
|
||||
title: "Login for AppFlowy"
|
||||
bodyClass: bg-purple-50
|
||||
---
|
||||
|
||||
<x-main>
|
||||
<div
|
||||
class="bg-purple-50 font-helvetica p-[24px] text-black flex flex-col justify-center"
|
||||
>
|
||||
<table align="center" class="bg-white w-[700px] p-[32px] flex flex-col justify-start items-center border-spacing-4">
|
||||
<tr>
|
||||
<td class="text-center">
|
||||
<img
|
||||
src="{{ cdnBaseUrl }}images/appflowy.png"
|
||||
class="overflow-hidden object-cover w-[56px] h-[56px]"
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<table align="center" class="p-0 flex flex-col items-center border-spacing-6">
|
||||
<tr>
|
||||
<td>
|
||||
<p
|
||||
class="text-center text-3xl font-bold m-0"
|
||||
>
|
||||
Your login code for AppFlowy
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<p
|
||||
class="text-center text-lg m-0"
|
||||
>
|
||||
This link and code will be expire in 5 minutes for security reasons.
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<x-button
|
||||
align="center"
|
||||
class="hover:opacity-90 cursor-pointer !bg-[#9327ff] m-0 rounded-2xl"
|
||||
href="@{{ .ConfirmationURL }}"
|
||||
>
|
||||
<div class="font-bold text-[16px]">Login to AppFlowy</div>
|
||||
</x-button>
|
||||
</td>
|
||||
</tr>
|
||||
</table
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<div class="mx-auto leading-4.5 text-base text-center">
|
||||
If the link does not work, you can use the verification code
|
||||
directly:
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="text-center">
|
||||
<p class="bg-gray-200 p-2 rounded text-center text-black text-lg font-bold inline-block m-0">@{{ .Token }}</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<x-divider space-x="10%" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<p class="m-0 text-sm text-gray-600 font-medium text-center">
|
||||
Bring projects, knowledge, and teams together with the power of AI.
|
||||
</p>
|
||||
|
||||
<p class="cursor-default text-center">
|
||||
<a
|
||||
href="https://twitter.com/appflowy"
|
||||
class="[text-decoration:none] mr-4"
|
||||
>
|
||||
<img
|
||||
src="{{ cdnBaseUrl }}images/twitter.png"
|
||||
width="20"
|
||||
alt="Maizzle"
|
||||
/>
|
||||
</a>
|
||||
<a
|
||||
href="https://www.reddit.com/r/AppFlowy"
|
||||
class="[text-decoration:none] mr-4"
|
||||
>
|
||||
<img
|
||||
src="{{ cdnBaseUrl }}images/reddit.png"
|
||||
width="20"
|
||||
alt="Maizzle"
|
||||
/>
|
||||
</a>
|
||||
<a
|
||||
href="https://github.com/AppFlowy-IO/AppFlowy"
|
||||
class="[text-decoration:none] mr-4"
|
||||
>
|
||||
<img
|
||||
src="{{ cdnBaseUrl }}images/github.png"
|
||||
width="20"
|
||||
alt="Maizzle"
|
||||
/>
|
||||
</a>
|
||||
<a
|
||||
href="https://discord.gg/9Q2xaN37tV"
|
||||
class="[text-decoration:none] mr-4"
|
||||
>
|
||||
<img
|
||||
src="{{ cdnBaseUrl }}images/discord.png"
|
||||
width="20"
|
||||
alt="Maizzle"
|
||||
/>
|
||||
</a>
|
||||
</p>
|
||||
<p class="m-0 text-sm text-gray-600 font-medium text-center">
|
||||
Copyright © 2025, AppFlowy Inc.
|
||||
</p>
|
||||
<p class="text-sm text-gray-600 font-medium text-center">
|
||||
Need Help? <a href="mailto:support@appflowy.io" class="text-gray-600">support@appflowy.io</a>
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div style="display: none">
|
||||
To login to AppFlowy, follow this link @{{ .ConfirmationURL }}
|
||||
</div>
|
||||
|
||||
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#f3e8ff" style="font-family: Google Sans, Robot, Arial, sans-serif; padding: 24px; color: #000000;">
|
||||
<tr>
|
||||
<td align="center" valign="top">
|
||||
<table width="600" border="0" cellpadding="0" cellspacing="0" bgcolor="#ffffff" style="border-radius: 12px; padding: 32px; margin: 0 auto;">
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 24px;">
|
||||
<img src="{{ cdnBaseUrl }}images/appflowy.png" width="32" height="32" style="border: 0; display: block; margin: 0 auto;" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 8px;">
|
||||
<h1 style="font-size: 24px; font-weight: bold; margin: 0; color: #000000;">Login for AppFlowy</h1>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 40px;">
|
||||
<p style="font-size: 16px; line-height: 1.5; margin: 0;">We received a request to log in to your AppFlowy account.</p>
|
||||
<p style="font-size: 16px; line-height: 1.5; margin: 2px 0 0 0;">You can log in using either of the following options:</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 12px;">
|
||||
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#F8FAFF" style="border-radius: 20px; padding: 24px 20px;">
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 16px;">
|
||||
<h2 style="font-size: 16px; font-weight: bold; margin: 0; color: #000000;">Option 1: Magic Link (Fast & Easy)</h2>
|
||||
<p style="font-size: 14px; color: #6F748C; margin: 10px 0 0 0;">Click the button or link below to log in instantly</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 16px;">
|
||||
<table border="0" cellpadding="0" cellspacing="0" style="margin: 0 auto;">
|
||||
<tr>
|
||||
<td align="center" bgcolor="#9327FF" style="border-radius: 10px; padding: 10px 16px;">
|
||||
<a href="@{{ .ConfirmationURL }}" style="color: #ffffff; font-weight: 600; font-size: 14px; text-decoration: none; display: inline-block;">Login to AppFlowy</a>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="center">
|
||||
<p style="padding-bottom: 16px; font-size: 12px; color: #6F748C; margin: 0;">Or paste this into your browser:</p>
|
||||
<p style="max-width: 384px;margin: 0;">
|
||||
<a href="@{{ .ConfirmationURL }}" style="font-size: 12px; text-decoration: none; text-align: center; color: #6F748C; font-weight: bold; margin: 0; word-break: break-all;">
|
||||
@{{ .ConfirmationURL }}
|
||||
</a>
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 20px;">
|
||||
<table width="100%" border="0" cellpadding="0" cellspacing="0" bgcolor="#F8FAFF" style="border-radius: 20px; padding: 24px 20px;">
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 16px;">
|
||||
<h2 style="font-size: 16px; font-weight: bold; margin: 0; color: #000000;">Option 2: One-Time Password (OTP)</h2>
|
||||
<p style="font-size: 14px; color: #6F748C; margin: 10px 0 0 0;">Prefer to enter a code instead? Use the one-time code below</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="center">
|
||||
<span style="background-color: #ffffff; padding: 8px; border-radius: 6px; font-weight: 600; font-size: 16px; display: inline-block;">@{{ .Token }}</span>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="center" style="padding-bottom: 60px;">
|
||||
<p style="font-size: 12px; color: #6F748C; margin: 0;">This code and magic link will expire in 5 minutes for security reasons.</p>
|
||||
<p style="font-size: 12px; color: #6F748C; margin: 0;">If you didn't initiate this login, you can safely ignore this email. No action is needed.</p>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td style="padding: 0 0 24px;">
|
||||
<table width="80%" border="0" cellpadding="0" cellspacing="0" style="border-top: 1px solid #e5e7eb; margin: 0 auto;"><tr><td></td></tr></table>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td align="center">
|
||||
<p style="font-size: 12px; color: #6F748C; margin: 0 0 15px 0;">Bring projects, knowledge, and teams together with the power of AI.</p>
|
||||
|
||||
<p style="margin: 0 0 15px 0;">
|
||||
<a href="https://twitter.com/appflowy" style="text-decoration: none; display: inline-block; margin: 0 10px 0 0;">
|
||||
<img src="{{ cdnBaseUrl }}images/twitter.png" width="20" height="20" alt="Twitter" style="border: 0;" />
|
||||
</a>
|
||||
<a href="https://www.reddit.com/r/AppFlowy" style="text-decoration: none; display: inline-block; margin: 0 10px 0 0;">
|
||||
<img src="{{ cdnBaseUrl }}images/reddit.png" width="20" height="20" alt="Reddit" style="border: 0;" />
|
||||
</a>
|
||||
<a href="https://github.com/AppFlowy-IO/AppFlowy" style="text-decoration: none; display: inline-block; margin: 0 10px 0 0;">
|
||||
<img src="{{ cdnBaseUrl }}images/github.png" width="20" height="20" alt="GitHub" style="border: 0;" />
|
||||
</a>
|
||||
<a href="https://discord.gg/9Q2xaN37tV" style="text-decoration: none; display: inline-block;">
|
||||
<img src="{{ cdnBaseUrl }}images/discord.png" width="20" height="20" alt="Discord" style="border: 0;" />
|
||||
</a>
|
||||
</p>
|
||||
|
||||
<p style="font-size: 12px; color: #6F748C; margin: 0 0 10px 0;">Copyright © 2025, AppFlowy Inc.</p>
|
||||
<p style="font-size: 12px; color: #6F748C; margin: 0;">
|
||||
Need Help? <a href="mailto:support@appflowy.io" style="color: #6F748C;">support@appflowy.io</a>
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</x-main>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue