Skip to content

Commit

Permalink
[Feat] 지원완료 이메일 템플릿 수정 및 반응형 추가 (#279)
Browse files Browse the repository at this point in the history 
* feat: 공통 이메일에 적용

* fix: 결과 이메일 템플릿 수정
  • Loading branch information
@lydiacho
lydiacho authored Jul 30, 2024
1 parent a0a7f00 commit 6c1431c
Showing 1 changed file with 82 additions and 27 deletions.
109 changes: 82 additions & 27 deletions src/views/email/complete.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,20 +4,42 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>지원서 접수 확인 메일</title>
<style>
@media screen and (max-width: 600px) {
.content {
width: 330px !important;
}
.title {
font-size: 20px !important;
line-height: 35px !important;
}
.text {
font-size: 12px !important;
line-height: 20px !important;
}
.blank {
height: 20px !important;
}
.small-text {
font-size: 10px !important;
line-height: 15px !important;
}
.horizontal-blank {
width: 0 !important;
}
}
</style>
</head>
<body style="margin: 0; padding: 0">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<table style="border: 0; border-spacing: 0; width: 100%">
<tr>
<td style="font-size: 0; line-height: 0" width="600" height="20">&nbsp;</td>
<td style="font-size: 0; line-height: 0; width: 600px; height: 20px" class="content">&nbsp;</td>
</tr>
<tr>
<td>
<table
bgcolor="#ffffff"
align="center"
cellpadding="0"
cellspacing="0"
width="600"
class="content"
style="
border-top-left-radius: 10px;
border-top-right-radius: 10px;
Expand All @@ -26,49 +48,75 @@
border-color: #c7c7c7;
border-width: 1px;
border-style: solid;
background-color: #ffffff;
border-spacing: 0;
margin-inline-start: auto;
margin-inline-end: auto;
width: 600px;
">
<tr>
<td style="font-size: 0; line-height: 0" height="75">&nbsp;</td>
<td style="font-size: 0; line-height: 0; height: 35px" class="blank">&nbsp;</td>
</tr>
<tr>
<td align="center">
<img src="iconLogo.svg" alt="sopt-logo" width="94" height="32" style="display: block" />
<td style="font-size: 0; line-height: 0; height: 35px" class="blank">&nbsp;</td>
</tr>
<tr>
<td>
<div style="width: 100%; text-align: center">
<img src="iconLogo.svg" alt="sopt-logo" width="94" height="32" />
</div>
</td>
</tr>
<tr>
<td style="font-size: 0; line-height: 0" height="13">&nbsp;</td>
<td style="font-size: 0; line-height: 0; height: 13px">&nbsp;</td>
</tr>
<tr>
<td
align="center"
style="
color: #0f1012;
font-family: 'SUIT', sans-serif;
font-size: 40px;
font-weight: 700;
line-height: 60px;
letter-spacing: -0.32px;
">
지원서 접수 확인 메일
text-align: center;
"
class="title">
<div style="width: 100%; text-align: center">
<span
style="
color: #0f1012;
font-family: 'SUIT', sans-serif;
font-size: 40px;
font-weight: 700;
line-height: 60px;
letter-spacing: -0.32px;
text-align: center;
"
class="title">
지원서 접수 확인 메일</span
>
</div>
</td>
</tr>
<tr>
<td style="font-size: 0; line-height: 0" height="29">&nbsp;</td>
<td style="font-size: 0; line-height: 0" height="29" class="blank">&nbsp;</td>
</tr>
<tr>
<td>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<table style="border: 0; border-spacing: 0; width: 100%" cellpadding="0">
<tr>
<td
align="center"
style="
color: #0f1012;
font-family: 'SUIT', sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 26px;
letter-spacing: -0.24px;
">
text-align: center;
"
class="text">
<span><%= userName %></span>님의 <span><%= term %></span>기 SOPT <span><%= part %></span>파트
</td>
</tr>
Expand All @@ -77,15 +125,16 @@
</tr>
<tr>
<td
align="center"
style="
color: #0f1012;
font-family: 'SUIT', sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 26px;
letter-spacing: -0.24px;
">
text-align: center;
"
class="text">
지원서가 성공적으로 접수되었습니다!
</td>
</tr>
Expand All @@ -94,23 +143,27 @@
</tr>
<tr>
<td
align="center"
style="
color: #0f1012;
font-family: 'SUIT', sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 26px;
letter-spacing: -0.24px;
">
text-align: center;
"
class="text">
SOPT에 많은 관심을 주셔서 감사합니다.
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td style="font-size: 0; line-height: 0" height="75">&nbsp;</td>
<td style="font-size: 0; line-height: 0; height: 30px" class="blank">&nbsp;</td>
</tr>
<tr>
<td style="font-size: 0; line-height: 0; height: 30px" class="blank">&nbsp;</td>
</tr>
</table>
</td>
Expand All @@ -120,9 +173,9 @@
</tr>
<tr>
<td>
<table align="center" border="0" cellpadding="0" cellspacing="0" width="600px">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="600px" class="content">
<tr>
<td style="font-size: 0; line-height: 0" width="22">&nbsp;</td>
<td style="font-size: 0; line-height: 0" width="22" class="horizontal-blank">&nbsp;</td>
<td
style="
color: #66666d;
Expand All @@ -131,12 +184,13 @@
font-weight: 400;
line-height: 20px;
letter-spacing: -0.32px;
">
"
class="small-text">
본 메일은 발신전용 메일로, 문의 및 회신하실 경우 답변되지 않습니다.
</td>
</tr>
<tr>
<td style="font-size: 0; line-height: 0" width="22">&nbsp;</td>
<td style="font-size: 0; line-height: 0" width="22" class="horizontal-blank">&nbsp;</td>
<td
style="
color: #66666d;
Expand All @@ -145,7 +199,8 @@
font-weight: 400;
line-height: 20px;
letter-spacing: -0.32px;
">
"
class="small-text">
메일내용에 대해 궁금한 사항이 있으시다면 ‘문의하기' 링크를 통해 문의해주시길 바랍니다.
<a href="https://pf.kakao.com/_JdTKd" target="_blank" rel="noreferrer noopener">문의하기</a>
</td>
Expand Down

0 comments on commit 6c1431c

Please sign in to comment.