Skip to content

Commit

Permalink
Merge pull request #251 from haedoang/feature/report
Browse files Browse the repository at this point in the history
update template
  • Loading branch information
haedoang authored Dec 26, 2023
2 parents 2271e10 + f272426 commit cdea96e
Showing 1 changed file with 156 additions and 168 deletions.
324 changes: 156 additions & 168 deletions src/main/resources/templates/contact-email-template.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,194 +6,182 @@
<title th:value="${title}"></title>
</head>
<body style="margin: 0; font-family: 'Pretendard', sans-serif">
<header
<table
style="
display: flex;
flex-direction: column;
padding: 20px 0;
background: #ff8e00;
align-items: center;
width: 100%;
border-collapse: collapse;
margin: 0;
font-family: 'Pretendard', sans-serif;
"
>
<img
src="https://kr.object.ncloudstorage.com/backend-bucket/images/templates/house.svg"
alt="house"
/>
</header>
<div
style="
display: flex;
flex-direction: column;
gap: 20px;
padding-top: 20px;
text-align: center;
align-items: center;
"
>
<div
style="
color: #ff8e00;
text-align: center;
font-size: 18px;
font-weight: 600;
"
>
<span th:text="${subtitle}" />
</div>
<div
style="
width: 50%;
display: flex;
padding: 20px;
flex-direction: column;
align-items: flex-start;
border-radius: 4px;
background: #fafafa;
"
>
<div
<tr>
<td
style="
width: 100%;
color: #212121;
display: block;
padding: 20px 0;
background: #FF8E00;
text-align: center;
font-size: 18px;
font-weight: 600;
padding-bottom: 10px;
"
>
Sender’s Profile
</div>
<div
style="
display: flex;
padding-bottom: 0px;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: stretch;
"
>
<img
src="https://kr.object.ncloudstorage.com/backend-bucket/images/templates/house.svg"
alt="house"
/>
</td>
</tr>
<tr>
<td style="display: block; padding: 20px; text-align: center">
<div
style="
width: 50px;
height: 50px;
border-radius: 45px;
overflow: hidden;
background: #bdbdbd;
color: #FF8E00;
text-align: center;
font-size: 18px;
font-weight: 600;
"
>
<img
style="width: 100%; height: 100%; object-fit: cover"
th:src="${userImageProfile}"
/>
<span th:text="${subtitle}" />
</div>
<div
style="
color: #424242;
font-size: 14px;
font-style: normal;
font-weight: 600;
padding-top: 10px;
width: 50%;
display: block;
padding: 20px;
margin: 0 auto;
border-radius: 4px;
background: #FAFAFA;
"
th:text="${userName}"
></div>
>
<div
style="
width: 100%;
color: #212121;
text-align: center;
font-size: 18px;
font-weight: 600;
padding-bottom: 10px;
"
>
Sender’s Profile
</div>
<div style="display: block; margin-bottom: 0px; text-align: center">
<div
style="
width: 50px;
height: 50px;
border-radius: 45px;
overflow: hidden;
background: #BDBDBD;
margin: 0 auto;
"
>
<img
style="width: 100%; height: 100%; object-fit: cover"
th:src="${userImageProfile}"
/>
</div>
<div
style="
color: #424242;
font-size: 14px;
font-style: normal;
font-weight: 600;
padding-top: 10px;
"
th:text="${userName}"
></div>
<div
style="
color: #757575;
font-size: 12px;
font-style: normal;
font-weight: 400;
"
>
<span th:text="${userAge}"></span>
<span>years old | </span>
<span th:text="${userGender}"></span>
</div>
<div
style="
color: #757575;
font-size: 12px;
font-style: normal;
font-weight: 400;
"
th:text="${contact}"
></div>
</div>
<hr style="width: 100%; border: 1px solid #eee" />
<p
style="
color: #757575;
font-size: 12px;
font-style: normal;
font-weight: 400;
"
th:text="${userDescription}"
></p>
</div>
<div
style="
color: #757575;
font-size: 12px;
font-style: normal;
font-weight: 400;
width: 50%;
display: block;
padding: 20px;
margin: 0 auto;
border-radius: 4px;
background: rgba(255, 142, 0, 0.1);
"
>
<span th:text="${userAge}"></span>
<span> years old | </span>
<span th:text="${userGender}"></span>
<div
style="
color: #FF8E00;
text-align: center;
font-size: 18px;
font-weight: 600;
width: 100%;
"
>
Message
</div>
<p
style="
color: #424242;
font-family: Pretendard;
font-size: 14px;
font-style: normal;
font-weight: 400;
margin: 0;
"
th:text="${message}"
></p>
</div>
<div
<a
style="
color: #757575;
font-size: 12px;
font-style: normal;
font-weight: 400;
display: block;
padding: 8px 10px;
margin: 0 auto;
border-radius: 2px;
border: 1px solid #FF8E00;
color: #FF8E00;
text-align: center;
font-size: 14px;
font-weight: 700;
width: 50%;
background-color: white;
text-decoration: none;
"
th:text="${contact}"
></div>
</div>
<hr style="width: 100%; border: 1px solid #eee" />
<p
style="
color: #757575;
font-size: 12px;
font-style: normal;
font-weight: 400;
"
th:text="${userDescription}"
></p>
</div>
<div
style="
width: 50%;
display: flex;
padding: 20px;
flex-direction: column;
justify-content: center;
align-items: flex-start;
gap: 10px;
border-radius: 4px;
background: rgba(255, 142, 0, 0.1);
"
>
<div
style="
color: #ff8e00;
text-align: center;
font-size: 18px;
font-weight: 600;
width: 100%;
"
>
Message
</div>
<p
style="
color: #424242;
font-family: Pretendard;
font-size: 14px;
font-style: normal;
font-weight: 400;
margin: 0;
"
th:text="${message}"
></p>
</div>
<a
style="
display: flex;
padding: 8px 10px;
justify-content: center;
align-items: center;
gap: 4px;
flex: 1 0 0;
border-radius: 2px;
border: 1px solid #ff8e00;
color: #ff8e00;
text-align: center;
font-size: 14px;
font-weight: 700;
width: 50%;
background-color: white;
text-decoration: none;
"
th:href="${roomLink}"
target="_blank"
>
<img
src="https://kr.object.ncloudstorage.com/backend-bucket/images/templates/house-cute.svg"
alt=""
style="width: 20px; height: auto"
/>
Go to room
</a>
</div>
th:href="${roomLink}"
target="_blank"
>
<img
src="https://kr.object.ncloudstorage.com/backend-bucket/images/templates/house-cute.svg"
alt=""
style="width: 20px; height: auto; margin-right: 4px"
/>
Go to room
</a>
</td>
</tr>
</table>
</body>
</html>
</html>

0 comments on commit cdea96e

Please sign in to comment.