AppFlowy-Cloud/email_template/src/templates/workspace_invitation.html

96 lines
4.9 KiB
HTML

---
title: "Confirm to join the workspace"
preheader: "Please confirm your email address to join the workspace."
bodyClass: bg-purple-50
---
<x-main>
<div class="bg-purple-50 font-helvetica sm:px-4 px-12 sm:py-12 py-24 text-black">
<table align="center">
<tr>
<td class="w-[552px] max-w-full">
<div class="w-full text-center">
<img src="{{ userIconUrl }}" class="rounded-full overflow-hidden object-cover" width="48px"
height="48px"
alt="{{ userName }}">
</div>
<p class="w-full text-center break-words whitespace-normal text-2xl">
<span class="text-3xl font-bold">{{ userName }}</span>
<span class="mx-2=1">invited you to </span>
<span class="text-3xl font-bold">{{ workspaceName }}</span>
</p>
<x-divider space-x="20%"/>
<table align="center">
<tr>
<td class="w-[60px]">
<div
style="border: 2px solid black;"
class="rounded-2xl mr-2 w-[60px] h-[60px] bg-white overflow-hidden">
<img src="{{ workspaceIconURL }}"
class="overflow-hidden object-cover"
width="100%" height="100%"
alt="{{ workspaceName }}">
</div>
</td>
<td>
<div class="font-bold mb-2">
{{ workspaceName }}
</div>
<div class="text-sm text-slate-500"> {{ workspaceMembersCount }} members</div>
</td>
</tr>
</table>
<x-button align="center"
class="hover:opacity-90 cursor-pointer !text-xl !leading-[20px] !bg-[#9327ff] !font-normal w-[60%] my-8 rounded-2xl"
href="{{ acceptUrl }}">
<div class="font-medium text-[24px]">
Join workspace
<div class="text-xs">require v0.5.6+ to continue</div>
</div>
</x-button>
<div class="mx-auto leading-4.5 text-sm text-slate-500 text-center w-[70%]">
By clicking "Join workspace" above, you confirm that you have read, understood, and agreed to
AppFlowy's <a href="https://appflowy.io/terms/app" class="text-slate-500">Terms &
Conditions</a>
and <a class="text-slate-500" href="https://appflowy.io/privacy/app">Privacy
Policy</a>.
</div>
<x-divider space-x="20%"/>
</td>
</tr>
<tr>
<td class="text-center text-slate-600 text-xs px-6">
<p class="m-0 mb-4 uppercase cursor-pointer">
<a href="https://appflowy.io">
<img src="{{ cdnBaseUrl }}images/appflowy-logo.png" width="150px">
</a>
</p>
<p class="m-0 text-sm text-black font-medium">
Bring projects, knowledge, and teams together with the power of AI.
</p>
<p class="cursor-default">
<a href="https://twitter.com/appflowy"
class="text-indigo-700 [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-indigo-700 [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-indigo-700 [text-decoration:none] mr-4">
<img src="{{ cdnBaseUrl }}images/github.png" width="20" alt="Maizzle">
</a>
<a href="https://discord.gg/9Q2xaN37tV"
class="text-indigo-700 [text-decoration:none] mr-4">
<img src="{{ cdnBaseUrl }}images/discord.png" width="20" alt="Maizzle">
</a>
</p>
</td>
</tr>
</table>
</div>
</x-main>